從html調用函數內部的JavaScript函數

Question

嵌套函數有點掙扎。 問題，我想從HTML調用函數，但是我所有的JavaScript都坐在里面等待DOM加載的函數。

如果我要從DOM加載的函數中調用要調用的函數，則無法從DOM加載的函數內部訪問變量。

Answer 1

大概當您說“從[您的] HTML調用函數”時，您的意思是：

<div onclick="yourFunction()">...</div>

...或類似。

這是不使用onxyz -attribute風格的事件處理程序的眾多原因之一：您只能調用自己的函數（如果它們是全局函數）。

相反，請使用現代事件處理技術（例如addEventListener （如果需要支持過時的Microsoft瀏覽器，則可以attachEvent如果需要，請使用attachEvent ；如果這樣做， 我的答案是可以使用的跨瀏覽器功能））來連接處理程序。 如果這樣做，則可以在代碼范圍內使用任何函數范圍內的代碼進行連接，而不必再成為全局函數。

簡單的例子：

 (function() { // Not global function fooClick() { console.log(".foo clicked"); } // Hook it up document.querySelector(".foo").addEventListener("click", fooClick); })(); 

 <div class="foo">Click me</div>