javascript中的循环不工作_Javascript_Html

javascript中的循环不工作

javascript html

javascript中的循环不工作,javascript,html,Javascript,Html,我想选择我的html中有多少个div。所以我用了。长度法，但它并没有给我想要的结果。你可以在这里看到一个演示 .main{宽度：980px；边距：0自动；边框：实心1px#F00；溢出：隐藏} .box{宽度：300px；浮点：左；边距右：20px；背景：#00F；高度：200px；} .new{边框：实心2px#333；} var amy=document.getElementsByTagName（'div'）；对于（i=0；i这不起作用，因为在脚本执行时，文档尚未处理为正文中的div。请

我想选择我的html中有多少个div。所以我用了。长度法，但它并没有给我想要的结果。你可以在这里看到一个演示


.main{宽度：980px；边距：0自动；边框：实心1px#F00；溢出：隐藏}
.box{宽度：300px；浮点：左；边距右：20px；背景：#00F；高度：200px；}
.new{边框：实心2px#333；}
var amy=document.getElementsByTagName（'div'）；
对于（i=0；i这不起作用，因为在脚本执行时，文档尚未处理为正文中的div。请尝试将脚本移动到div下，或等待文档加载事件。
尝试此操作
    for (i=0;i<amy.length;i++){
        var jar= amy[i];
 alert(jar) //put  it here , ur problem will be solved

        }
//     alert(jar) //Dont put here

for（i=0；i将脚本更改为：
<script type="text/javascript">
    var amy = document.getElementsByTagName('div');
    for (i = 0; i < amy.length; i++) {
        var jar = i;
    }
    alert(jar);
</script>


var amy=document.getElementsByTagName（'div'）；
对于（i=0；i
如果您的脚本在加载页面时运行，在div出现之前，还没有div。您应该添加一个页面加载事件来触发代码。顺便说一句，您的JSFIDLE可以工作……它为代码启用了onload
根据您的澄清意见，由于您希望结果为4，最简单的方法是使用.length
，就像您在自己的示例中在循环中所做的那样！无需循环：
var length = amy.length; // Will return 4

但是，如果您想要循环，可以像这样使用已呈现的循环（尽管非常不必要，因为您可以像上面一样使用length属性！）
var长度=0；
对于（i=0；i这是工作原理。但是我真的不理解您的期望。请在下面找到代码的解释
var amy= document.getElementsByTagName('div');

上面一行只选择HTML页面上的Div标记。现在，当前HTML包含三个包装在主Div中的Div标记，即总共4个Div元素。因此，第一个警报是“4”
for (var i=0;i<amy.length-1;i++){
        var jar= amy[i];
        alert(jar.innerHTML);
}

for（var i=0；i试试这个-

.main{宽度：980px；边距：0自动；边框：实心1px#F00；溢出：隐藏}
.box{宽度：300px；浮点：左；边距右：20px；背景：#00F；高度：200px；}
.new{边框：实心2px#333；}
函数计数（）{
var amy=document.getElementsByTagName（'div'）；
对于（i=0；i您可以简单地使用.length
。就像这样
为了确保DOM已完全加载，您可以将脚本简单地放在html
文档的末尾，就在关闭正文
-标记之前
嗯,
--hennson
您是在提醒html div，而不是length属性。请参阅我的注释以获取更新的JSFIDLE。无需循环。为什么不执行
var amy= document.getElementsByTagName('div');

for (var i=0;i<amy.length-1;i++){
        var jar= amy[i];
        alert(jar.innerHTML);
}

.main { width:980px; margin:0 auto; border:solid 1px #F00; overflow:hidden}

.box { width:300px; float:left; margin-right:20px; background:#00F; height:200px;}
.new {border:solid 2px #333;}

</style>


<script type="text/javascript">

function count() {
    var amy= document.getElementsByTagName('div');

    for (i=0;i<amy.length;i++){
        var jar= amy[i];
    }
     alert(jar.className);

}


</script>

</head>

<body onload="count()">
<div id="main">
<div class="box"><h3>first</h3></div>
<div class="box"><h3>secnond</h3></div>
<div class="box"><h3>third</h3></div>

</div>
</body>