無法在Chrome Extension中從外部js訪問HTML元素

Question

嗨，我正在學習構建Chrome擴展程序，並且對該領域來說是一個新手。 我正在這里進行非常基本的擴展，甚至在開始執行主要任務之前，我就一直停留在演示代碼中。 當我單擊擴展名時，我只是希望在段落標簽中打印“ hello”或任何消息。

這是HTML代碼：

<!DOCTYPE html>
<html>
    <head>
        <title>hi</title>
        <style>
        p
        {
            color:red;
            font-size:20px;
        }
        </style>
        <script src="getMSG.js"></script>
    </head>

    <body>
        <p id='content'></p>
    </body>
</html>

這是getMSG.js的代碼：

document.getElementById('content').innerHTML = 'Hello';

當我在HTML代碼中簡單地編寫“ Hello World”時，我的擴展工作正常。 但是現在，當我這樣做時，我什么都沒有輸出。 請有人幫忙嗎？ 提前致謝：）

Answer 1

要訪問DOM元素的屬性，您需要在窗口加載時執行以下操作：

// Using pure JavaScript
window.onload = function() {
    document.getElementById('content').innerHTML = 'Hello';
}

Answer 2

我已經測試了您的代碼，但無法正常工作，我認為內容頁面未完全加載，因此，在您的“ getMSG.js”中將此代碼與jQuery一起使用是首選方法：

$(document).ready(function () {
    document.getElementById('content').innerHTML = 'Hello';
});

對我來說很好。

無法在Chrome Extension中從外部js訪問HTML元素

問題描述

2 個解決方案

解決方案1
3 已采納 2013-08-25 05:30:11

解決方案2
2 2013-08-25 05:24:10

無法在Chrome Extension中從外部js訪問HTML元素

問題描述

2 個解決方案

解決方案1 3 已采納 2013-08-25 05:30:11

解決方案2 2 2013-08-25 05:24:10

解決方案1
3 已采納 2013-08-25 05:30:11

解決方案2
2 2013-08-25 05:24:10