僅供學習，轉載請注明出處

行間事件

什么是行間事件？

將JavaScript函數寫到HTML元素中的執行事件，那這種事件就是行間事件。

下面寫一個示例，如下：

可以看到，在代碼中點擊則執行fnClick()方法。這種寫在HTML元素中的方式就是行間事件。

那么下面點擊執行一下看看，如下：

其中，可以看到點擊按鈕之后，下面div的字體就變了樣式。

但是，可以看到在寫fnClick() 函數的時候并沒有用window.onload的方法包裹著，為什么沒有抱錯呢？

這是因為在點擊事件的時候才會執行這個fnClick()函數，此時整體頁面的內容都已經被加載了，所以不會抱錯。

但是這樣寫行間事件有不少缺點。那就是JavaScript與HTML代碼混淆在了一起，很不好。

應該要將JavaScript的函數提取出來，單獨在js文件中編寫，方便后續外部引入，這樣才好管理。

那么這種提取方式，就是叫做提取行間事件。

提取行間事件

接著上面的代碼，處理思路如下：

• 首先需要將HTML中的onclick="fnClick()"屬性寫到JavaScript代碼中
• 因為此時fnClick()被提取之后，如果沒有包裹window.onload的時候，在獲取oDiv的時候就會抱錯，所以需要加上window.onload的包裹。

實現如下：

點擊一下按鈕看看樣式是否變化。

這里關鍵給input元素增加了id="btn1"，方便用來定位元素。
另一個要注意的是，在JavaScript中oBtn.onclick = fnClick;的fnClick不能寫成fnClick()。
如果寫成了fnClick()，那么就會直接執行。

---

總結

以上是生活随笔為你收集整理的JavaScript 行间事件、提取行间事件的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。