0

好的，我有一个简单的 HTML 文档：

<head>
</head>

<body>
<div id="notInvolved">  This div is static</div>
<div id="thing01"></div>
<div id="thing02"></div>
<div id="thing03"></div>
</body>

我想使用外部 JavaScript 来操作 div。我的计划如下

  1. 创建一个名为 divCounter 的数组
  2. 按 ID 添加 div##
  3. 获取数组的长度
  4. 在一个由数组大小控制的 for 循环中，一次加载一个 div，添加一些数据，移动到下一个 div 并添加一些令人恶心的数据，直到我用完 div。

我显然不明白如何构建一个动态数组......（我不能静态地做到这一点我不知道最终我会有多少东西## divs）

我想我可以这样做var divCounter = [document.getElementById("thing"+ * + *)]; ，这会添加字符串（例如thing01，Thing02）。但这不起作用。你如何设置通配符getElementById？如果你不能，你怎么能做到？

有没有办法做到这一点，还是我在叫错树？我讨厌做新手......

4

5 回答 5

3

笼统地说（因为您提供的代码很少），ID 应该是您应该在事物唯一时使用的东西，而当需要分组访问事物时应该使用类。这样做更有意义：

<body>
  <div id="notInvolved">  This div is static</div>
  <div id="thing01" class="affected"></div>
  <div id="thing02" class="affected"></div>
  <div id="thing03" class="affected"></div>
</body>

一旦你有了将它们结合在一起的东西，你就可以用它document.getElementsByClassName('affected')来检索它们。for这可能比尝试使用循环或其他构造检索单个元素更有意义。

于 2012-07-13T17:41:18.660 回答
0

我不完全理解您要完成的工作。无论如何，为了让您了解如何将一个元素添加到数组中，前提是它的 ID 以字符串“thing”开头，这里有一个简单的示例，说明如何使用 for 循环、getElementByTagName 函数以及如何使用访问 DOM 元素的属性。您真正想要做的（向数组添加元素）是使用 divCounter 数组的 push 方法完成的。

var everyDiv = document.getElementsByTagName('div');
var divCounter = [];
for( var i = 0; i < everyDiv.length; i++ ){
    var currentDiv = everyDiv[i];
    var currentID = currentDiv.id; 
    if (currentID != null && currentID.indexOf('thing') == 0){
        divCounter.push(currentDiv);
    };
}
var res = divCounter.length;

当然，这是为了清楚起见，我会从不同的角度来处理这个问题，并且我会以更简洁的方式对其进行编码。我同意其他答案：在这些 div 之间共享的类将是选择这些元素的最佳方式。相同（采用相同的程序方法）的一个例子是：

var everyDiv = document.getElementsByTagName('div'), 
    divCounter = [], 
    i, currentID;
for( i = 0; i < everyDiv.length; i++ ){
    currentID = everyDiv[i].id;
    if ( currentID && currentID.indexOf('thing') == 0){
        divCounter.push(everyDiv[i]);
    };
}

这完全一样，但在开始时声明了变量。由于在 JavaScript 中，变量的作用域是函数，而不是代码块，因此在开始时使用单个“var”声明来启动函数是理想的。

于 2012-07-13T18:03:27.383 回答
0 
function load() {
  var divTags = document.getElementsByTagName("div");
  var divArray = new Array();
  var j = 0;
  for(i = 0; i < divTags.length; i++) {
    if(divTags[i].id.substr(0,5) == "thing") {
      divArray[j++] = divTags[i].id;
    }
  }
  for(i = 0;i < divArray.length; i++)
    alert(divArray[i]);
}
于 2012-07-13T18:07:03.823 回答
0

您可以使用通配符选择页面上的所有元素，然后使用正则表达式过滤元素。 

 var all =document.getElementsByTagName('*');
 var r = /^thing\d+$/;
 var test = function(el){
      return r.test( el.getAttribute('id'));
 }
 var elements = [];
 for(var i=0,l=all.length;i<l;i++)
     If(test(all[i]))
         elements.push(all[i]);
于 2012-07-13T17:43:33.637 回答
0

您应该在要修改的动态 div 上使用类，然后遍历getElementsByClassName的结果：

var dynamicDivs = document.getElementsByClassName('dynamic');

for (var i = 0; i < dynamicDivs.length; i++) {
    // do whatever you want with dynamicDivs[i]
}
于 2012-07-13T17:50:01.983 回答