javascript - document.write() 和 Ajax - 不起作用，寻找替代方案

Question

我最近问了一个问题here ，并收到了很好的回应(我很快就会接受最积极的答案，除非出现更好的替代方案)，但不幸的是，似乎建议的两个选项都不与 Ajax 兼容(< em>或任何包含此类“内联相对 jQuery”的动态添加内容)

无论如何，我的问题与良好的 ole' document.write() 相关。

当页面仍在渲染时，效果很好；当附加片段包含它时就不那么重要了。是否有任何替代方案不会破坏现有页面内容，但仍会内联附加字符串，如调用发生的位置？

换句话说，是否有一种方法/替代 document.write() ，在渲染后调用时不会破坏现有的页面内容？可以说是 Ajax 友好版本吗？

<小时/>

这就是我要去的地方:

var _inline_relative_index = 0;
function $_inlineRelative(){
    // i hate non-dedicated string concatenation operators
    var inline_relative_id = ('_inline_relative_{index}').replace('{index}', (++_inline_relative_index).toString());
    document.write(('<br id="{id}" />').replace('{id}', inline_relative_id));
    return $(document.getElementById(inline_relative_id)).remove().prev('script');
}

然后:

<div>
    <script type="text/javascript">
        (function($script){
            // the container <div> background is now red.
            $script.parent().css({ 'background-color': '#f00' });
        })($_inlineRelative());
    </script>
</div>

Answer 1

您可以访问每个 DOM 节点的 innerHTML 属性。如果您直接设置它，您可能会破坏元素，但如果您向其附加更多 HTML，它将保留现有的 HTML。

document.body.innerHTML += '<div id="foo">bar baz</div>';

innerHTML 的大锤有各种细微差别，因此我强烈建议使用 jQuery 等库来为您标准化一切。