Question

我找不到任何关于这个令人惊讶的好文档，所以我在这里发布它。

原始javascript与此无关：

$(elem).click(function(){
    alert(this.text());
});

所有我能找到的是<elem onlick="func()" />这不是我想要的，我希望能够只使用javascript而不是在元素的上下文中。

Answer 1

假设elem是一个元素节点（如果没有，你需要使用你的选择器来使用getElementById或其他）：

elem.onclick= function() {
    var text= 'textContent' in elem? elem.textContent : elem.innerText;
    alert(text);
};

textContent是从元素中获取文本的符合标准的方法; innerText是IE的方式。（有一些差异，但希望没有任何会影响你的。）如果你需要支持那些既不需要做旧的/模糊的浏览器，你就不得不进行繁琐的树步行来获取所有文本（这就是jQuery的{{ 1}}。）

（我假设你想要的是text()。这实际上不起作用 - 大概是你的意思this.text()。）

Answer 2

有几种方法可以在不使用库的情况下附加单击处理程序。第一个是将函数分配给元素的on[eventname]属性：

element.onclick = function (eventObj) { 
    alert("textContent" in this ? this.textContent : this.innerText) 
}

您还可以指定要评估的代码字符串，但它不是很漂亮且通常可以避免。另一种方法是使用w3c标准addEventListener：

element.addEventListener("click", function (eventObj) { 
    alert("textContent" in this ? this.textContent : this.innerText) 
}, false);

当前版本的IE不支持attachEvent而不是

element.attachEvent("onclick", function () { 
    alert(event.srcElement.innerText); 
});

IE在将该函数应用于触发事件的元素时遇到问题，因此this将无法正确指向具有attachEvent的元素。

第一种方法element.onclick对于x-browser兼容性和快速编码很有用，但是你只能为属性分配一个函数。使用attachEvent和addEventListener，您可以添加任意数量的函数，它们都可以正常启动。您可以在代码中创建跨浏览器半等效的简单功能检查：

if ("addEventListener" in element)
    element.addEventListener("click", function (eventObj) { 
        alert("textContent" in this ? this.textContent : this.innerText) 
    }, false);
else
    element.attachEvent("onclick", function () { 
        alert(event.srcElement.innerText); 
    });

Answer 3

您可以执行object.onclick = handler

var el = document.getElementById('elem');
elem.onclick = function(){ alert("Clicked!") };

这应该有用 - 我现在对javascript有点啰嗦！

Answer 4

也许你需要这样的东西：

document.getElementById('element_id').setAttribute("onclick","alert('hello world')");

Javascript事件检测

4 个答案: