Our submission:

https://devtools.tech/questions/implement-jquerycss-method-or-frontend-interview-question-or-javascript/submissions/o5viAep1vw01uVx2dXor?utm_source=submission-social-share

One possible implementation could be:

function _getProperty(property) {
  var element = document.querySelector(this.element);
  var styleMap = window.getComputedStyle(element);

  if (Array.isArray(property)) {
    return property.reduce((response, currentProperty) =&gt; {
      response[currentProperty] =
        styleMap.getPropertyValue(currentProperty) || '';

      return response;
    }, {});
  }

  return styleMap.getPropertyValue(property) || '';
}

function _setProperty(property, value) {
  var elements = document.querySelectorAll(this.element);

  elements.forEach((element, index) =&gt; {
    if (typeof property === 'object') {
      var properties = Object.keys(property);

      properties.forEach((p) =&gt; {
        element.style[p] = property[p];
      });
    } else if (typeof value === 'function') {
      var currentValue = element.style[property];
      var computedValue = value.call(element, index, currentValue);

      element.style[property] = computedValue || currentValue;
    } else {
      element.style[property] = value;
    }
  });
}

function css() {
  // write your solution below

  var args = Array.prototype.slice.call(arguments);
  var areGetParamsVaild = typeof args[0] === 'string' || Array.isArray(args[0]);
  var shouldGet = arguments.length === 1 &amp;&amp; areGetParamsVaild;
  var isPropertyObject = arguments.length === 1 &amp;&amp; typeof args[0] === 'object';

  if (shouldGet) {
    return _getProperty.call(this, args[0]);
  } else if (arguments.length === 2 || isPropertyObject) {
    return _setProperty.call(this, args[0], args[1]);
  }
}

function jq(element) {
  return {
    element,
    css,
  };
}

Do you see value in our efforts?

Implement jQuery.css method | Frontend Interview Question | JavaScript

@Devtools Tech