1

Javascriptを使用してボックスインデックス番号を取得したい。私は4つのボックスを持っているので、各ボックスのテキストにこの適切な番号を付けたいと思います。

<head>

  <script type="text/javascript">
  function () {
   var Main= document.getElementById('container').getElementsByTagName('div');

for(i=0; i<Main.length;i++){



}

  }
  </script>
  <style>
  .box {
    float:left;
    margin-left:20px;
    position:relative
  }
  .width {
    position:absolute;
    left:0;
    top:0;
    color:#FFF;
    font-size:20px;
  }
  </style>
</head>
<body>
  <div id="container">
    <div class="box">

      <img src="img/sample1.jpg" height="200" width="300" />
    </div>
    <div class="box">

      <img src="img/sample2.jpg" height="200" width="350" />
    </div>
    <div class="box">

      <img src="img/sample3.jpg" height="200" width="150" />
    </div>
    <div class="box">

      <img src="img/sample4.jpg" height="200" width="100" />
    </div>
  </div>
</body>
4

2 に答える 2

2 
window.onload=function() {
   var Main= document.getElementById('container').getElementsByTagName('div');

  for(var i=0; i<Main.length;i++){
    Main[i].innerHTML+= '<span class="title">box '+(i+1)+'</span>';
  }
}

デモ

于 2012-07-14T13:02:17.700 に答える
1

すべてのJSを以下のこれに置き換え、スクリプトタグをbodyタグの最後のタグとして配置して、これが呼び出されたときにDOMの準備ができていることを確認します。onloadイベントからこの関数を呼び出すこともできます。

(function(){
    var Main= document.getElementById('container').getElementsByTagName('div');
    for(var i=0; i<Main.length;i++){
      Main[i].innerHTML += "box"+i;
    }
})();

http://jsfiddle.net/mmjW9/

于 2012-07-14T13:04:24.650 に答える