javascript - 如何从此 Blogger 小部件中删除 document.write

Question

我正在开发一个 Blogger 小部件，试图摆脱任何已弃用或不良做法(基于我在 Stack Overflow 上阅读的内容)，例如 document.write

这是有效的:

<script type="text/javascript">
    function introductory(json) {
        document.write('<div id="intro-wrapper">');
        var i;
        for (i = 0; i < json.feed.entry.length; i++) {
            var introTitle = json.feed.entry[i].title.$t;
            var introContent = json.feed.entry[i].content.$t;
            var item = '<h2>' + introTitle + '</h2><p>' + introContent + '</p>';
            document.write(item);
        }
     document.write('</div>');
    }
</script>
<script src="https://MYBLOG.blogspot.com/feeds/posts/default/-/intro?max-results=1&alt=json-in-script&callback=introductory"></script>

它显示一个单个帖子(. ..max-results=1... )，通过 Blogger 标签标记为“介绍”( .../-/intro?... )。

我已经测试了各种替代方案，在 js 之前排列我的 html 元素，然后使用 getElementById，然后是 innerHTML 或 appendChild，甚至通过 createElement 将元素 inside 排列在 js 中，但实际上无济于事。任何人都可以指出我正确的方向吗？

P.S. 我很难复制粘贴我在这个问题上的所有尝试。有几十个，因为我对 javascript 或多或少一无所知，我只是在试验我的前进方向，所以我选择只发布实际工作的代码并寻求替代方案不使用document.write，如果那确实是“不好的做法”的话。

Answer 1

我在开始时问候你试图摆脱 document.write

在文档中的 JS 代码之前创建一个具有唯一 id 的元素，然后通过其 id getElementById 选择该元素并使用 添加您的内容innerHTML

<div id="intro-wrapper"></div>

<script type="text/javascript">
    function introductory(json) {
        var item="";
        for (var i = 0; i < json.feed.entry.length; i++) {
            var introTitle = json.feed.entry[i].title.$t;
            var introContent = json.feed.entry[i].content.$t;
            item += '<h2>' + introTitle + '</h2><p>' + introContent + '</p>';
        }
     document.getElementById('intro-wrapper').innerHTML=item;
    }
</script>
<script src="https://MYBLOG.blogspot.com/feeds/posts/default/-/intro?max-results=1&alt=json-in-script&callback=introductory"></script>