javascript中某些html的实际宽度有问题

我试图使用javascript函数width来获取容器的宽度，并使用它来计算一些滚动文本应该从哪里开始滚动（我希望它在黄色框中滚动）：

现在，javascript代码如下所示：

alert(yellowBox.width());
alert(yellowBox.innerWidth());
alert(yellowBox.outerWidth());

全部显示，944，但我已经确定黄色框的宽度实际上是500，但我不想使用该值，因为宽度可能会改变

我不知道如何得到盒子的实际宽度。我尝试过使用

yellowBox.offsetWidth（）

和

yellowBox.clientWidth

，但它们都不起作用，而Web开发人员firefox的Web控制台插件告诉我“yellowBox.offsetWidth不是函数”，而且“yellowBox.clientWidth也不是函数”

这是我的密码：

html:

---

原因可能是您在错误的div或元素上使用了

width（）

innerWidth（）

和

outerWidth（）

<div id="div1">
 <div id="div2" style="height:100px;width:300px;background-color:lightblue;"></div>
</div>
<script>
$(document).ready(function(){
    alert("Width of outer div: " + $("#div1").width()+"="+   $("#div1").innerWidth()+"="+ $("#div1").outerWidth());
    alert("Width of inner div: " + $("#div2").width()+"="+   $("#div2").innerWidth()+"="+ $("#div2").outerWidth());
});
</script>

$（文档）.ready（函数（）{
警报（“外部div的宽度：+$（“#div1”）.Width（）+“=”+$（“#div1”）.innerWidth（）+“=”+$（“#div1”）.outerWidth（））；
警报（“内部div的宽度：+$（“#div2”）.Width（）+“=”+$（“#div2”）.innerWidth（）+“=”+$（“#div2”）.outerWidth（））；
});

将为您提供不同的值

请尝试以下操作：

$(window).load(function(){
    $('.marquee').marquee({'direction' : 'right', 'delayStart' : '0', 'duration' : '1000000'});
});

或

---

你能用一个JSFIDLE来演示这个问题吗？到目前为止，你所拥有的东西真的很难帮助你。在控制台中不起作用，因为它不知道yelowbox是什么。你是如何确定宽度是500的？还要添加一些相关的html/css，这样我们就知道这个盒子是怎么回事了e> .我真的不明白你怎么知道宽度是“真的”“500px，但有一件事，你不需要一直在你的div上调用

marquee

。在

marquee

代码中已经有一个超时。删除setInterval正如ColinI所评论的那样，我不认为我使用了错误的div——我已经更新了问题的更多细节，显示了我的相关代码，并解释了我是如何知道框的宽度的500.这可能很傻，但是你的div和

的类在哪里得到了宽度944？因为你的选框div会得到100%的Yogesh，我想当宽度被警告时，div的宽度是100%，然后在内联CSS时变为更小的宽度executes@Zword，我不确定，但代码使用的是bootstrap.css：当您在跨度中包装您的选框时，父对象的宽度可能会改变。我想到的是尝试固定父元素的宽度。抱歉，这是问题中的一个错误，我的html代码实际上包含。marquee类，我已经更新了问题以显示这一点。当我提醒宽度时，你的PHP内容是否超出了屏幕宽度？如果我做
提醒（parCh.width（））
，它显示的是
44168
，因为$rssContent的值是不同新闻故事标题的一个很长的列表，但这不是我用来获取黄色框宽度的值，我正在尝试
par.width（）
，
par.innerWidth（）
，和
par.outerWidth（）
，所有这些都给出了
944
，即使正确的宽度约为
500
。您可以添加页面的屏幕截图吗？我删除了设置间隔，并添加了网页的屏幕截图
function scrollMarquee() {
    setInterval("scrollMarquee()", 1000000);

$('.marquee').marquee({'direction' : 'right', 'delayStart' : '0', 'duration' : '1000000'});

}

<div id="div1">
 <div id="div2" style="height:100px;width:300px;background-color:lightblue;"></div>
</div>
<script>
$(document).ready(function(){
    alert("Width of outer div: " + $("#div1").width()+"="+   $("#div1").innerWidth()+"="+ $("#div1").outerWidth());
    alert("Width of inner div: " + $("#div2").width()+"="+   $("#div2").innerWidth()+"="+ $("#div2").outerWidth());
});
</script>

$(window).load(function(){
    $('.marquee').marquee({'direction' : 'right', 'delayStart' : '0', 'duration' : '1000000'});
});

$(document).ready(function(){
    $('.marquee').marquee({'direction' : 'right', 'delayStart' : '0', 'duration' : '1000000'});
});