Question

我正在创建Chrome扩展程序。它有一个浏览器动作。单击该按钮时，将运行javascript文件。该文件创建一个新选项卡。在该选项卡中，有div。我正试图操纵他们的内容。重新解释一个问题：如何在第一次单击按钮时使其工作。（注意：如果我单击按钮然后刷新页面，那么该版本的代码将一直有效，直到我更改代码然后再次刷新页面。）

在Chrome的帮助页面中，我找到了：

//通过侦听完全加载DOM后添加事件侦听器 // DOMContentLoaded事件在文档上，并添加您的侦听器 //触发时的特定元素 document.addEventListener（'DOMContentLoaded'，function（）{ document.querySelector（'button'）。addEventListener（'click'，clickHandler）; }）;

http://developer.chrome.com/extensions/contentSecurityPolicy.html

清单中的Javascript文件：

chrome.browserAction.onClicked.addListener(function(tab) {

//This is to put the manager one tab to the right
var myIndex = tab.index;
chrome.tabs.create({index : myIndex + 1, url: "newTab.html"});

newTab.html

<script type="text/javascript" src="jquery.min-1.8.2.js"></script>
<script type="text/javascript" src="functionality02.js"></script>
<html><head>
<title>Title</title>

</head><body>
<div id='try'></div>

</body></html>

functionality02.js

function letsTryThis2(){

$("#try").append("<div>Some Content.</div>");
}

document.addEventListener('DOMContentLoaded', letsTryThis2);

Answer 1

function letsTryThis2(){
    $("#try").append("<div>Some Content.</div>");
}
$(window).load(function () {
  letsTryThis2();
});

修改作为我评论的（BAD）替代品，你可以试试这个：

function letsTryThis2(){ $("#try").append("<div>Some Content.</div>"); } $(function(){ setTimeout(function(){ letsTryThis2(); },2000); });

Answer 2

Chrome扩展程序已加载到浏览器中，就像网站上的JavaScript加载到页面上一样。如果您更改源代码，则需要在最坏的情况下重新加载应用程序并最多刷新页面。

Chrome扩展程序并非专为实时更改而设计，因为这样做效率很低，只有您（开发人员）才会受到影响。

你所看到的行为是完全正常的。加载时，脚本会嵌入到页面中。要重新加载修改后的源，您必须重新加载页面，以便再次应用它。考虑到您的用户永远不会遇到此问题，除非他们是Chrome黑客并使用代码，在这种情况下，他们可能知道刷新页面。 ;）

如果我刷新页面，jQuery可以工作，但不能在原始负载上运行。 Chrome扩展程序

2 个答案: