在WordPress管理沒有DOM

我正確地插入JavaScript文件到WordPress管理有：在WordPress管理沒有DOM

wp_enqueue_script()

我知道腳本加載。我用alert()進行了測試。然後我發現我無法訪問DOM。當我嘗試：

document.getElementsByTagName('body')[0].addEventListener('load', function() {});

此錯誤是：

Uncaught TypeError: Cannot call method 'addEventListener' of undefined

這是我第一次使用「設置API」或插入腳本到WordPress管理。

來源

2012-09-23 Chris

你真的想Load事件處理程序添加到window不body。首先，直到BODY標籤被解析後，body纔會存在。如果你的腳本在HEAD中，那麼這樣做太快，無法將任何東西附加到身體上。所以，如果你想要一個腳本在DOM被加載之前不運行，你不能通過嘗試向DOM中的一個對象添加一個事件處理程序來達到目的。

我會強烈推薦使用JS框架來處理這個問題。添加自己的函數以在頁面加載時運行是您想要跨瀏覽器兼容並且易於擴展的內容。主要的JS框架已經解決了這個問題，在嘗試手動完成時幾乎沒有什麼收穫。

來源

2012-09-23 21:34:17 Dancrumb

@FabrícioMatté偉大的一點;謝謝。我已更新我的回答 – Dancrumb

對於更新後的版本，刪除了以前的評論。 –

您的代碼可能在DOM完全加載之前執行並且<body>不可用。如果你想運行負載的功能，我會用jQuery.ready()如jQuery是已經可以在WordPress的默認：

jQuery(document).ready(function($){ /* your code */ });

http://api.jquery.com/ready/

來源

2012-09-23 21:31:04 doublesharp

將腳本排入頁面的footer。

您不需要一個DOM就緒處理程序，而不需要那麼多的負載監聽器。
也@Dancrumb回答，load是一個window事件，而不是body的。

默認情況下，WP將腳本排入head。您不能直接從head中訪問body元素而沒有偵聽器/延遲執行，因爲DOM解析器根本沒有達到body標記。通過將腳本放在頁腳中，可以確保DOM已經準備好運行腳本。

的語法wp_enqueue_script()是：

wp_enqueue_script( 
    $handle 
    ,$src 
    ,$deps 
    ,$ver 
    ,$in_footer 
);

因此，對於你的使用情況，設置5日選項true。

來源

2012-09-23 21:43:52

我想你可以試試這個

document.addEventListener('DOMContentLoaded', load, false);

或

window.onload=load; // onload will work in all browsers so use this

和處理程序

function load(){ ... }

您也可以按照Fabrício Matté的做法。

來源

2012-09-23 21:44:47

是的，這是一個不錯的方法，'window.onload'適用於所有瀏覽器 - 但是如果你有超過1個腳本使用它，你必須注意不要覆蓋它。 'DOMContentLoaded'非常好，但在老版本的IE中不起作用。 –

是的，覆蓋和感謝是正確的。 –

現在我想到了，舊版本的IE甚至不會支持'addEventListener'方法，所以是的，+1，因爲你的答案是唯一利用純JS來解決問題 - 即使'window.onload '只會在所有圖像加載完成後執行，即使在IE6上也可以運行。 –

在WordPress管理沒有DOM

回答

相關問題