gpt4 book ai didi

javascript - 为什么我无法访问 document.querySelectorAll 的某些元素

转载 作者:太空宇宙 更新时间:2023-11-04 00:39:06 27 4
gpt4 key购买 nike

我是编程新手,我想了解为什么我可以以某种方式访问​​某些元素,而为什么我不能以相同的方式访问其他元素。

有代码:

    const cImg = document.querySelectorAll('#cImg');
console.log('c :', cImg);

console.log('element : ', cImg['0'].offsetHeight);

cImg.forEach(element => {
console.log('e :', element.clientWidth);
});

我在“cImg”的 console.log 中看到元素 offsetHeightclientWidth

enter image description here

enter image description here

如果我尝试在 forEach 中记录 ofsetHeilght,我会收到此错误

enter image description here

enter image description here

但如果我这样做:cImg['0'].offsetHeight 我有正确的显示“399”如果我想在 forEach 中查看元素“clientWidht”,它会显示“298”

我不明白为什么,因为这两个元素都在“cImg 数组”中。

有人解释一下吗?

非常感谢。

最佳答案

[编辑]

要通过 javascript 获取元素中的 CSS,您需要通过 element.style

尝试

element.style.offsetHeight

[edit 2] 不是,不是因为获取CSS是element.style.height,javascript获取不到CSS代码。星期六晚上喝太多酒。 :P


[编辑 2]

function displayWidth() {
const cImg = document.querySelectorAll('.cImg');

console.log('c :', cImg);

if (cImg.length) {
console.log('element : ', cImg[0].offsetHeight);

cImg.forEach(element => {
console.log('e :', element.clientWidth);
});
}

}
<body onload="displayWidth()">

<div class="cImg">
askldajsldkjasdklasd
</div>

<div class="cImg">
askldajsldkjasdklasd
</div>


<div class="cImg">
askldajsldkjasdklasd
</div>


<div class="cImg">
askldajsldkjasdklasd
</div>

</body>


未经测试,但每个元素只能有自己的唯一 ID(如果有的话)。您可以与 querySelectorAll 一起使用的是类(除其他外)。所以一群人中的每个人都有自己独特的名字,但都属于 humans 类。将 id="cImg" 更改为 class="cImg" 并改用 querySelectorAll(".cImg")

关于javascript - 为什么我无法访问 document.querySelectorAll 的某些元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58674400/

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