Перестроить jQuery собственных функций в HTMLElements в Javascript

Question

Я хочу повторно реализовать функции jQuery.

Например, .attr () .

Я нашел несколько тем, например this .

Итак, я попробовал что-то вроде:

HTMLElement.prototype.attr = (pAttributeName, pAttributeValue) => {
  if(pAttributeValue){
    this.setAttribute(pAttributeName, pAttributeValue);
  } else {
      return this.getAttribute(pAttributeName);
  }
};

Но это не работает. Должен ли я сначала инициализировать элементы в конструкторе?

Answer 1

Из документации :

Выражение функции стрелки (также известное как функция жирной стрелки) имеет более короткий синтаксис по сравнению с выражениями функций и лексически связывает это значение

В вашем случае this был привязан к объекту window.

Использование обычной функции

HTMLElement.prototype.attr = function(pAttributeName, pAttributeValue) {
  if (pAttributeValue) {
    this.setAttribute(pAttributeName, pAttributeValue);
  } else {
    return this.getAttribute(pAttributeName);
  }
};

document.querySelector('h1').attr('id', 'head')

#head {
  color: red;
}

<h1>Heading</h1>