Question

尝试使用.insertAdjacentHTML替换.innerHTML并遇到问题。看来innerHTML会在替换时解析变量，但insertAdjacentHTML不会。任何指导将不胜感激。这是一个例子：

JS：

    var colors = ['red', 'blue', 'green', 'orange', 'purple'];

    function docW() {
        document.write(colors[3]);
    }

    function innerH() {
        var i = document.getElementById("here");
        i.innerHTML = (colors[3]);
    }

    function insertA() {
        var j = document.getElementById("here");
        j.insertAdjacentHTML = ('beforeEnd', colors[3].toString()); 
                                            //colors[3] doesn't work either
    }

HTML：

 <p>My favorite color is: <span id="here"> </span></p>

 <input id="write" type="button" value="Write" onclick="docW()" />
 <input id="inner" type="button" value="InnerHTML" onclick="innerH()" />
 <input id="adjacent" type="button" value="AdjacentHTML" onclick="insertA()" />

前两个按预期工作，我不能让第三个加载任何东西或抛出任何错误。提前谢谢。

Answer 1

.insertAdjacentHTML是一个功能。你必须把它称为一个函数 - 所以在你的情况下：

function insertA() {
    var j = document.getElementById("here");
    j.insertAdjacentHTML('beforeEnd', colors[3]);
}

您在原始代码段中执行的操作是使用j覆盖元素insertAdjacentHTML的{{1}}方法，而不是附加到元素

insertAdjacentHTML和Array变量

1 个答案: