如何通过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