Chrome 应用程序：为什么我不能修改页面？答案

【问题标题】：Chrome app: Why can't i modify the page?Chrome 应用程序：为什么我不能修改页面？
【发布时间】：2013-11-26 20:19:58
【问题描述】：

这可能是一个超级基本的问题，但我似乎无法在任何地方找到一个直接的答案......

为什么document.getElementById('pID').innerHTML = 'test'; 不改变 p 元素内的文本？ console.log('test'); 也不起作用...

HTML：

<!DOCTYPE html>
<html>
<head>
</head>
<body>
    <p id="pID">Hello, world!</p>
</body>
</html>
<script src="main.js"></script>

JAVASCRIPT：

chrome.app.runtime.onLaunched.addListener(onLoad);

function onLoad() {
 chrome.app.window.create('window.html', {          
    'bounds': {
    'width': 400,
    'height': 900
    }
 });
}

清单.JSON：

{
"name": "Hello World!",
"description": "My first Chrome App.",
"version": "0.1",
"app": {
"background": {
    "scripts": ["background.js"]
}
}
}

MAIN.JS：

function onLoad() {
  console.log('test');
  document.getElementById('pID').innerHTML = 'test';
}
window.onload=onLoad;//This is what I was missing!

@rshanchez：我更改了它，但出现以下错误（仍然不起作用）：

拒绝执行内联事件处理程序，因为它违反了以下内容安全策略指令：“default-src 'self' chrome-extension-resource:”。请注意，'script-src' 没有显式设置，因此 'default-src' 用作后备。

@rshanchez：我制作了 window.onload=onLoad;并且做到了。谢谢您的帮助！如果您希望代表点回答问题，我会将其标记为已回答...否则 +1 对您来说太棒了！

【问题讨论】：

你的脚本是在后台页面运行的，所以你访问的document对象就是后台页面的对象。要操作window.html 文档，您需要使用<script src="xxx.js"> 标记从window.html 文件中包含一个脚本。
@rsanchez：您的评论虽然正确，但有点片面。还可以通过为 chrome.app.window.create() 调用提供一个回调参数来访问和修改 window.html 的文档，它应该看起来像 function(win)，并在其正文中使用 win.contentWindow.document。
@SergeyShevchenko 你说得对，谢谢！
@Dave 我用你的文件进行了测试，没有得到你提到的错误。正如@sowbug 提到的，您现在在main.js 末尾缺少window.onload=onLoad;。

标签： javascript google-chrome-app

【解决方案1】：

没有人调用您的名为“onLoad”的函数。也许你想要 window.onload （注意大小写；关闭不算）。

【讨论】：