Javascript 为什么clientWidth等于0？

我是一个初学者，写了一个网站，并试图添加到我的主页图像旋转木马。我有6个图像显示在屏幕上，彼此相邻。我想做的是在网站加载时将我的图片1移到左边，这样第一个显示的就是幻灯片1。以下是my index.html的一部分：

    <div class="cover-art-carousel">
        <div class="slide">
            <img src="./covers/slide6.jpg" id="lastClone">
            <img src="./covers/slide1.png">
            <img src="./covers/slide2.png">
            <img src="./covers/slide3.jpg">
            <img src="./covers/slide4.jpg">
            <img src="./covers/slide5.jpg">
            <img src="./covers/slide6.jpg">
            <img src="./covers/slide1.png" id="firstClone">
        </div>
    </div>

    <button id="prevBtn">Prev</button>
    <button id="nextBtn">Next</button>
    
    <script src="app.js"></script>`

---

当我加载站点时，clientWidth等于0，尽管我知道它应该是300。最奇怪的是，如果我在JS中添加一个警报，它就可以正常工作。我肯定我错过了一些非常明显的东西，但如果有人能帮上忙，那就太好了。希望这是有意义的。谢谢

像这样包装您的js脚本：

window.onload = function(){ the rest of your js.....

}

---

您可能试图在加载图像之前获取宽度。

您的意思是javascript被忽略且从不运行，还是在页面完成加载后才运行？它可能已运行但未更改任何内容，您是否检查了变量的值？@Kira抱歉，javascript已运行，但是没有任何变化，图像也不会移动。我能让他们移动的唯一方法是，如果我的js中有一个警报，我不想让你在某处使用

prevButton

和

nextButton

？使用（点击

F12

）并读取任何错误。开发工具提供了一个Inspector/Elements选项卡，您可以使用该选项卡检查CSS是否应用于元素。如果是，问题是你的CSS，而不是你的JS。使用诸如立即查找代码问题之类的工具。@DanteSuarez好的，现在你可以提出一个聪明的问题：不是“为什么我的浏览器忽略了我的JS”（不是），而是“为什么

clientWidth

等于

0

”。Google会给你一些提示，但是请考虑使用<代码>自然宽度> /COD>。您仍然需要等待图像开始加载。“看起来您可能试图在加载dom之前执行js” — 这是什么原因造成的<代码>位于相关HTML的下方。还有，为什么要等待加载每个资源？为什么不

addEventListener（“DOMContentLoaded”，function（）{

..

}）

或OP中的

延迟

属性：当我加载站点时，浏览器会忽略我的Javascript。最奇怪的是，如果我在我的JS中添加了一个警报，事情就会正常运行。我肯定我错过了一些非常明显的东西，但如果有人能帮上忙，那就太好了。希望这是有意义的。谢谢正如我在其他评论中提到的，这可能是问题的解决方案，但推理是错误的。无论哪种方式，我都无法撤销我的投票，但是如果正确的理由（<代码> clieStuts <代码> 0代码>没有加载任何东西）被编辑，我可以否决这个答案。@ USS464 2212如果图像没有被加载，你会考虑DOM加载吗？DOM保证在页面“加载”（使用所有外部资源）之前完成加载。

window.onload = function(){ the rest of your js.....