每次浏览器重新加载时“clientwidth”的变化-解网

问：

我正在处理这个轮播，我遇到了一个问题，其中 clientWidth 在 console.log（element）和 console.log（element.clientWidth）中不同，我想知道为什么会发生这种情况。当我第一次保存文件时，两个值是相同的，但是一旦我重新加载，它们就会显示不同的值。

我试图只用文本重现同样的事情，但文本似乎不会发生。

如果要重现问题，请在此处查看代码。

const box = document.querySelector(".box")
console.dir(box)
console.log(box.clientWidth)

.box {
  display: flex;
  width: 100%;
  align-items: start;
}
    
.fs {
  flex-shrink: 0;   
}

<div class="box">
  <img class="fs" src="https://images-cdn.ubuy.co.in/63ef0a397f1d781bea0a2464-star-wars-rogue-one-movie-poster.jpg">
  <img class="fs" src="https://hippy.in/wp-content/uploads/2014/06/lagaan-bollywood-movie-poster.jpg">
  <img class="fs" src="https://moomar.co.uk/wp-content/uploads/2019/06/Back-To-The-Future.jpeg">
</div>

您可以在 codePen 中查看此内容。

JavaScript DOM 浏览器渲染 DOM 操作

提示：如果你不懂JS，就不要自己写轮播。只需从人们已经从货架上制作的一百万个旋转木马中抓住一个并使用它。然后，你可以选择一些你无法添加的东西，如果不先学习JS和HTML的复杂性，比如确保它是可访问的，有效地加载内容，等等。

0赞 Shin 9/24/2023

@Mike'Pomax'Kamermans 我很欣赏这个提示，但我只是想知道为什么 clientWidth 在 console.log（element）和 console.log（element.clientWidth）中不同

答：

-2赞 sonuods 9/23/2023 #1

document.getElementById（“id”）.style.width= “100%”;

https://www.w3schools.com/js/js_htmldom_css.asp 并寻求帮助

JS + CSS 一次加载，加载 javascript

每次浏览器重新加载时“clientwidth”的变化

Change in "clientwidth" with every browser reload

评论

评论