如何通過JQuery將文本添加到段落標記？

我想寫我的第一個Chrome擴展，以測試我從codecademy（HTML/CSS，JQUERY和Javascript）獲得的知識。首先，我試圖通過按鈕的onclick將文本追加到段落標籤。如何通過JQuery將文本添加到段落標記？

繼承人我的代碼：

<!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'); 
    }; 
});

它可能是一些非常基本的，我做錯了，但在正確的方向一推將是非常感謝:)

來源

2014-04-08 AxiΩmega

請同時發佈您的manifest.json – Xan

您是not allowed to use inline scripting像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放入您的擴展的文件夾並在本地加載。
味道的問題，但我會把getFacebookData()定義在$(document).ready之外，所以它可以在全球範圍內使用。另外，不需要它之後的分號。

最後，但並非最不重要：對於未來debugging，檢查您的擴展的相應頁面的控制檯。對於背景/選項頁面等內容，您應該可以從開發者模式擴展列表中訪問它們。對於彈出窗口，您應該右鍵單擊您的擴展程序的按鈕並選擇「檢查彈出窗口」。

來源

2014-04-08 21:54:36 Xan

另外代碼不會彈出。進入內容腳本。 –

非常感謝很多人！你救了我哈哈 –

@ user3512870很高興爲你效勞！請將答案標記爲已接受，以便將問題視爲已結束。 – Xan

如何通過JQuery將文本添加到段落標記？

回答

相關問題