0
function get(s){
    return document.querySelector(s);
}

function getAll(s){
    return document.querySelectorAll(s);
}
Node.prototype.click=function(ev){
    this.addEventListener("click",ev)
}

NodeList.prototype.click=function(ev){
    this.forEach(el=>el.addEventListener("click",ev))
}

window.onload=function(){
    get("b").click(function(){
        console.log(this)
    })

    getAll("b").click(function(){
        console.log(this)
    })
}

<b>1</b>
<b>2</b>
<b>3</b>
<b>4</b>
<b>5</b>

NodeList работает а Node почему то нет. в чем проблема?

2 ответа 2

2

Проблема в количестве уровней имплементации:

.querySelector возвращает конкретный Element

Цепочка прототипов полученного элемента выглядит так:

HtmlElement
Element
Node

При этом, непосредственно свойство click есть сразу у HtmlElement.

Таким образом, поиск до Node.prototype.click просто не доходит.

2
  • и как же повесить .click() на Node?
    – axmed2004
    5 ноя 2021 в 13:33
  • @axmed2004, нужно удалить click непосредственно у элемента :)
    – Grundy
    5 ноя 2021 в 13:34
0

В том, что у элемента уже есть функция click.

function get(s) {
  return document.querySelector(s);
}

function getAll(s) {
  return document.querySelectorAll(s);
}
Node.prototype.click1 = function(ev) {
  this.addEventListener("click", ev)
}

NodeList.prototype.click = function(ev) {
  this.forEach(el => el.addEventListener("click", ev))
}

window.onload = function() {
  console.log(get("b").click);
  
  get("b").click1(function() {
    console.log(this)
  })

  getAll("b").click(function() {
    console.log(this)
  })
}
<b>1</b>
<b>2</b>
<b>3</b>
<b>4</b>
<b>5</b>

3
  • у Node есть функция onclick, а я хочу чтобы работала как prototype.click
    – axmed2004
    5 ноя 2021 в 13:30
  • @axmed2004, так не получится
    – Grundy
    5 ноя 2021 в 13:35
  • @axmed2004 We don't always get what we want.
    – user176262
    5 ноя 2021 в 13:36

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.