Javascript: Как заставить элемент управления отправлять себя в методе

Question

<a href="" id="someId" onclick="SomeMethod(self);"></a>

Где SomeMethod может иметь:

function SomeMethod(item)
{
  item.setAttribute('name', item.id);
}

Вместо:

function SomeMethod(itemId)
{
  var someItem;

  someItem = document.getElementById(itemId);
  someItem .setAttribute('name', someItem .id);

}

Глупый пример, но идея состоит не в том, чтобы отправлять сам идентификатор, а в фактический элемент управления, вызывающий метод. Клянусь, это можно сделать, но мне не повезло в поиске ... частично, потому что я даже не уверен, что искать.

Я думал, что это я, но я, кажется, не то, что я хочу, когда сценарий у меня запускается.

Answer 1

Используйте ключевое слово this.

<a href="" id="someId" onclick="SomeMethod(this);"></a>

Answer 2

На самом деле вам не нужно передавать this в качестве аргумента вашей функции, поскольку у вас есть объект события click , к которому вы можете получить доступ. Итак:

<a href="" id="someId" onclick="clickEventHandler()"></a>
<script>
function clickEventHandler(event) {

    if (!event) {
        event = window.event; // Older versions of IE use 
                              // a global reference 
                              // and not an argument.
    };

    var el = (event.target || event.srcElement); // DOM uses 'target';
                                                 // older versions of 
                                                 // IE use 'srcElement'
    el.setAttribute('name', el.id);

}
</script>

Answer 3

Я склонен использовать этот подход во всех вызовах функций из атрибутов HTML: -

onclick="SomeMethod.call(this)"

Затем в JavaScript сделайте: -

function SomeMethod()
{
   this.setAttribute('name', this.id);
}

Это дает явное преимущество, когда вы также можете напрямую назначать свойства обработчика событий в коде Javascript: -

document.getElementById("someID").onclick = SomeMethod

Если бы SomeMethod взял элемент контекста в качестве параметра, было бы очень неудобно установить: -

function(id) {
   var elem = document.getElementById(id)
   elem.onclick = function() { SomeMethod(elem); }
}("someID");

Хуже того, это будет закрытие утечки памяти.

Answer 4

В этот момент: SomeMethod(this) - this возвращает объект окна, поэтому не используйте его. Правильный способ использования ключевого слова this делает его релевантным контексту, поэтому используйте SomeMethod.call(this).