如何通過JQuery向段落標簽添加文本？

Question

我正在嘗試編寫我的第一個chrome擴展程序，以測試從代碼學院（HTML / CSS，JQUERY和Javascript）獲得的知識。 首先，我試圖通過按鈕的onclick將文本追加到段落標簽中。

這是我的代碼：

  <!doctype html>
<html>
    <head>
        <title>Facebook event graph</title>

        <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.6.1.min.js"></script>
        <script src="popup.js"> </script>
    </head>
    <body>
        <form id="inputUrl">
                Enter a URL:  <input type="text" name="url" id="url">
                <button type="button" onclick="getFacebookData()"> Get Data </button>
        </form>
        <canvas id="graph" width="300" height="100">   
        </canvas> 
        <p id="text" width="300" height="100">1</p>
    </body>
</html>

和我的popup.js：

$(document).ready(function(){

    //Variables
    function getFacebookData() {
        $('p').append('Test');
    };
});

這可能是我做錯了的非常基本的事情，但是朝着正確方向的推動將不勝感激:)

Answer 1

不允許使用內聯腳本，例如onclick="getFacebookData()"
您必須從html刪除處理程序：
```
 <button type="button" id="my-button"> Get Data </button> 
```
而且您必須將處理程序移到popup.js中：
```
 $(document).ready(function(){ $('#my-button').click(getFacebookData); }); 
```
默認情況下，出於內容安全策略的原因，默認情況下，您也不允許從外部CDN加載jQuery，當然也不允許從http加載jQuery。 而且你不應該！ 將jQuery放在擴展程序的文件夾中，然后在本地加載。
口味問題，但是我將getFacebookData()定義放在$(document).ready ，因此它在全局范圍內可用。 同樣，不需要在其后的分號。

最后但並非最不重要的一點：為了將來進行調試，請檢查擴展程序相應頁面的控制台。 對於諸如background / options頁面之類的東西，您應該能夠從Developer Mode擴展列表中訪問它們。 對於彈出窗口，應右鍵單擊擴展程序的按鈕，然后選擇“檢查彈出窗口”。

如何通過JQuery向段落標簽添加文本？

問題描述

1 個解決方案

解決方案1
1 已采納 2014-04-08 21:54:36

如何通過JQuery向段落標簽添加文本？

問題描述

1 個解決方案

解決方案1 1 已采納 2014-04-08 21:54:36

解決方案1
1 已采納 2014-04-08 21:54:36