insertAdjacentHTML不是待办事项列表中的函数

时间:2019-06-23 10:12:16

标签: javascript

我正在做我的第一个纯Todolist的Js项目。我想要当用户在列表中添加项目时将其放置在列表中。我使用的是在教程中看到的这段代码,但它给出了一个错误。

显示错误:jeep.insertAdjacentHTML is not a function

这是标记:

 <section class="listContent">
    <div class="container">
        <ul class="list" id="deep">
            <li style="text-align: center" id="itemList">
                <!--   < i class="fa fa-circle-o pull-left" id = "circle" aria - hidden="true" > </i>
                <p class="text" > DRINK COFFEE < /p>
                <i class="fa fa-trash pull-right" id = "delete" aria - hidden="true" > </i> -->
            </li>
        </ul>
    </div>
</section>

这是JS

const date = document.getElementById("date");
const jeep = document.getElementById("deep");
const items = document.getElementById("itemList");
function addToDo(todo) {
    const item =
        `<i class="fa fa-circle-o pull-left" job="complete" id="circle" aria-hidden="true"></i>
        <p class="text"> ${todo}</p>
        <i class="fa fa-trash pull-right" id="delete" job="delete" aria-hidden="true"></i>
        ` ;

    const position = "beforeend";
    console.log(item);
    console.log(position);
    jeep.insertAdjacentHTMl(position, item);

}

addToDo("drink coffe");

1 个答案:

答案 0 :(得分:0)

首先尝试.insertAdjacentHTML-L应该大写。同样,在HTML标记中,该元素也位于<li>内部,并且不相邻。看来您可能想在.appendChild()上使用<ul id="deep"></ul>