切勿使用.onclick()
或用户脚本中的类似属性！在常规网页中，这也是较差的做法）。
原因是用户脚本在沙箱（“隔离的世界”）中
onclick运行，并且在目标页面范围内运行，并且看不到脚本创建的任何功能。
始终使
addEventListener()Doc（或等效的库函数，如jQuery.on（））。
因此，而不是像这样的代码：
something.outerHTML += '<input onclick="resetEmotes()" id="btnsave" ...>'
您将使用：
something.outerHTML += '<input id="btnsave" ...>'document.getElementById ("btnsave").addEventListener ("click", resetEmotes, false);对于循环，您无法将数据传递给类似Seedoc的事件侦听器。再加上每次您进行这样的更改
innerHTML，都将破坏以前的事件侦听器！
无需大量重构代码，就可以通过数据属性传递数据。因此，使用如下代码：
for (i = 0; i < EmoteURLLines.length; i++) { if (checkIMG (EmoteURLLines[i])) { localStorage.setItem ("nameEmotes", JSON.stringify (EmoteNameLines)); localStorage.setItem ("urlEmotes", JSON.stringify (EmoteURLLines)); localStorage.setItem ("usageEmotes", JSON.stringify (EmoteUsageLines)); if (i == 0) { console.log (resetSlot ()); } emoteTab[2].innerHTML += '<span id="'+ EmoteNameLines[i]+ '" data-usage="' + EmoteUsageLines[i] + '">' + '<img src="' + EmoteURLLines[i] + '" /></span>' ; } else { alert ("The maximum emote (" + EmoteNameLines[i] + ") size is (36x36)"); }}//-- only add events when innerHTML overwrites are done.var targetSpans = emoteTab[2].querySelectorAll ("span[data-usage]");for (var J in targetSpans) { targetSpans[J].addEventListener ("click", appendEmote, false);}其中appendEmote像这样：
function appendEmote (zEvent) { //-- this and the parameter are special in event handlers. see the linked doc. var emoteUsage = this.getAttribute ("data-usage"); shoutdata.value += emoteUsage;}警告：
- 您的代码对多个元素重复使用相同的ID。不要这样做，这是无效的。给定的ID每页只能出现一次。
- 每次使用
.outerHTML
或时.innerHTML
，都会在受影响的节点上丢弃所有事件处理程序。如果使用此方法，请当心这一事实。
