Передача 'this' в событие onclick

Возможный дубликат:
Текущий элемент как его параметр функции события

Будет ли это работать

<script type="text/javascript">
var foo = function(param)
{
    param.innerHTML = "Not a button";
};
</script>
<button onclick="foo(this)" id="bar">Button</button>

вместо этого?

<script type="text/javascript">
var foo = function()
{
    document.getElementId("bar").innerHTML = "Not a button";
};
</script>
<button onclick="foo()" id="bar">Button</button>

И сможет ли первый метод загрузить javascript из другого места для выполнения действий над любым элементом страницы?

Ответ 1

Код, который у вас есть, будет работать, но выполняется из глобального контекста, что означает, что this относится к глобальному объекту.

<script type="text/javascript">
var foo = function(param) {
    param.innerHTML = "Not a button";
};
</script>
<button onclick="foo(this)" id="bar">Button</button>

Вы также можете использовать альтернативу non-inline, которая прикрепляется и выполняется из контекста конкретного элемента, который позволяет вам получить доступ к элементу из this.

<script type="text/javascript">
document.getElementById('bar').onclick = function() {
    this.innerHTML = "Not a button";
};
</script>
<button id="bar">Button</button>

Ответ 2

Вы всегда можете вызвать funciton по-другому: foo.call(this); таким образом вы сможете использовать контекст this внутри функции.

Пример:

<button onclick="foo.call(this)" id="bar">Button</button>

var foo = function()
{
    this.innerHTML = "Not a button";
};

Ответ 3

Да, первый метод будет работать над любым элементом, вызванным из другого места, поскольку он всегда будет принимать целевой элемент независимо от id.

проверьте эту скрипту

http://jsfiddle.net/8cvBM/

Ответ 4

В JavaScript this всегда ссылается на "владельца" функции, которую мы выполняем, или, вернее, на объект, который является функцией. Когда мы определяем нашу верную функцию doSomething() на странице, ее владельцем является страница или, вернее, объект окна (или глобальный объект) JavaScript.

Как работает ключевое слово "his" ?