我实际上正在开发我的第一个 Chrome 扩展程序，即使它运行顺利，我也从get()我用来检索一些数据的函数中得到了很多错误，以及一个关于代码安全性的恼人错误。
下面是涉及的代码：
弹出窗口.html
<!doctype html>
<html>
<head>
<title>NGI Little Helper - Subscribes</title>
<link rel="stylesheet" href="popup.css">
<!-- JavaScript and HTML must be in separate files for security. -->
<script type="text/javascript" src="common/jquery.js"></script>
<script type="text/javascript" src="popup.js"></script>
</head>
<body>
<h1>Topics</h1>
<div id="content">..:: Loading ::..</div>
</body>
</html>
弹出窗口.js
这个脚本开始制作$.get()一个远程网页。变量的内容data可以在这里找到
$.get("http://gaming.ngi.it/subscription.php?do=viewsubscription", function(data) {
var TDs = $('td[id*="td_threadtitle_"]', data);
$(document).ready(function() {
$("#content").html("<br/>");
$.each( TDs, function() {
//Removes useless elements from the source
$('img[src="images/misc/tag.png"]', this).remove();
$('span', this).remove(); //$('span[class="smallfont"]', this).remove();
$('div[class="smallfont"]', this).remove();
$('img[src="images/buttons/firstnew.gif"]', this).attr('src', '/img/icons/comment.gif');
$('a[style="font-weight:bold"]', this).removeAttr("style");
//Modify the lenght of the strings
if ($("a[id^='thread_title_']", this).text().length > 35) {
$("a[id^='thread_title_']", this).text( $("a[id^='thread_title_']", this).text().substring(0, 30) + " [...]" );
}
//Modify the URL from relative to absolute and add the target="_newtab"
$("a[id^='thread_']", this).attr('href', "http://gaming.ngi.it/"+ $("a[id^='thread_']", this).attr('href'));
$("a[id^='thread_']", this).attr('target', "_newtab");
//Send the HTML modified to the popup window
$("#content").html($("#content").html() + $('div', this).wrap("<span></span>").parent().html() +"<br/>" );
});
});
});
在这里您可以找到所有 jquery 操作后的 HTML。
老实说，我无法理解为什么会显示这些错误，尤其是与安全相关的错误。我没有在 popup.html 中使用任何内联代码。
清单文件.json
{
"name": "NGI Little Helper",
"version": "0.8.5",
"manifest_version": 2,
"description": "Extension per gli Utenti del forum gaming.ngi.it",
"options_page": "fancy-settings/source/index.html",
"background": {
"page": "background.html"
},
"icons": {
"16": "img/logo16.png",
"48": "img/logo48.png",
"128": "img/logo128.png"
},
"content_scripts": [{
"matches": ["*://gaming.ngi.it/*"],
"js": ["common/jquery.js", "logo_changer/logo_change.js"],
"run_at": "document_start"
}],
"browser_action": {
"default_icon": "img/icon.png",
"default_popup": "popup.html",
"default_title": "Visualizza Subscriptions"
},
"permissions": [
"*://gaming.ngi.it/*"
]
}
以下是一段 HTML 代码，在所有操作后将呈现到弹出窗口中。所有的div都与此类似，只是 url 发生了变化：
<div>
<a href="http://gaming.ngi.it/showthread.php?goto=newpost&t=555954" id="thread_gotonew_555954" target="_newtab"><img class="inlineimg" src="/img/icons/comment.gif" alt="Go to first new post" border="0"></a>
<a href="http://gaming.ngi.it/showthread.php?goto=newpost&t=555954" id="thread_title_555954" target="_newtab">[All Gamez] [Frozen Synapse] S [...]</a>
</div>
如果需要，我可以提供完整的源代码。