gpt4 book ai didi

javascript - 与 jQuery 的 $() 不同,由于 document.getElementById() 和 document.querySelector() 不返回节点,无法在 vanilla JS 上附加子项

转载 作者:行者123 更新时间:2023-11-30 13:46:41 25 4
gpt4 key购买 nike

我做不到:

document.querySelector("#myDiv").appendChild("<img src='./img/mine.png' class='mine hidden'></img>");

或:

document.getElementById("myDiv").appendChild("<img src='./img/mine.png' class='mine hidden'></img>");

这两种方法都将文本放入调用它们的 div 中。唯一有效的是:

$("#myDiv").append("<img src='./img/mine.png' class='mine hidden'></img>");

我相信这是因为 jQuery 的 $() 的普通 JS 替代品不返回节点。

console.log(document.getElementById("myDiv"))
console.log(document.querySelector("#myDiv"))
console.log($("#myDiv"))
document.getElementById("myDiv").append("<p>Hi</p>")
document.querySelector("#myDiv").append("<p>Hi</p>")
$("#myDiv").append("<p>Hi</p>")
div {
height: 80px;
background-color: green;
width: 100%;
}

p {
background-color: red;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="myDiv"></div>

最佳答案

Vanilla JS 具有设置 HTML 节点内部值的功能。

也许试试这个而不是追加函数:

document.getElementById("myDiv").innerHTML = "<img src='./img/mine.png' class='mine hidden'></img>"

关于javascript - 与 jQuery 的 $() 不同,由于 document.getElementById() 和 document.querySelector() 不返回节点,无法在 vanilla JS 上附加子项,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59183242/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com