Hostinger Website Builder，嵌入的Javascript无法访问文档正文

Question

我有一个 Hostinger 网站构建器创建的网站，我正在尝试通过 Javascript 使用其数据属性进行访问，将标题添加到锚标记。我检查了相关网页并获取了每个锚标记（超链接）的数据属性值。然后我将以下代码嵌入到包含锚点的部分的底部：

<script>
function imLoaded() {
debugger
    var hyp = document.querySelectorAll('[data-page-id]');
    for (var i=0; i < hyp.length; i++) {
        switch (hyp[i].dataset.pageId) {
            case 'zgkVBI':
                hyp[i].title = "this is title one";
                break;
            case 'zW5Rwe':
                hyp[i].title = "this is title two";
                break;
        }
    }
}
window.addEventListener("load", imLoaded);
</script>

正文中是锚标签：

<a href='myserver.com' data-page-id="zgkVBI">This is a test</a>
<a href='myserver.com' data-page-id="zW5Rwe">This is another test</a>

1. 我已经在网站构建器之外的文本网页中测试了 JavaScript，它可以工作
2. 调试器已启动，我可以单步执行代码
3. 我使用 document.body.innerHTML 创建了一个监视变量，我看到的只是 javascript 代码
4. 我使用函数和加载事件侦听器来确保在运行脚本之前加载文档正文。

那么，我如何从 Javascript 引用网页的正文？...它在哪里？

PS。如果不使用 Hostinger Website Builder（以前称为 Zyro），这就没有意义，因为它是特定于该产品的。没有 Hostinger 标签。

Answer 1

我从未使用过 Hostinger Website Builder，但是，根据您的描述，我认为这是因为代码位于 iframe 内。如果 document.body.innerHTML 只显示脚本，那么一定是它。 因此，这意味着您只查看 iframe 文档，而不查看页面文档。范围不对。要解决此问题，您可以使用以下代码移动到主范围：

window.top.document

如果是这样的话，你需要将所有文档更改为window.top.document

在开发工具中，您可以看到您的代码在该部分中的范围，如图所示：