2

I have some div ids that are generated dynamicly via php

<div id='a<?php echo $gid?>>

How can I access them in JavaScript? All these divs start with "A" followed by a number.

Is there some kind of search function

getElementById(a*)?

Thanks for any help

4

7 回答 7

2

没有通用的 JavaScript 函数（至少不是跨浏览器），但您可以使用.getElementsByTagName并迭代结果：

var arrDivs = document.getElementsByTagName("div");
for (var i = 0; i < arrDivs.length; i++) {
    var oDiv = arrDivs[i];
    if (oDiv.id && oDiv.id.substr(0, 1) == "a") {
        //found a matching div!
    }
}

这是您可以获得的最低级别，因此您不必担心旧浏览器、新浏览器或未来的浏览器。

要将其包装成一个更整洁的函数，您可以：

function GetElementsStartingWith(tagName, subString) {
    var elements = document.getElementsByTagName(tagName);
    var result = [];
    for (var i = 0; i < elements.length; i++) {
        var element = elements[i];
        if (element.id && element.id.substr(0, subString.length) == subString) {
            result.push(element);
        }
    }
    return result;
}

使用示例是：

window.onload = function() {
    var arrDivs = GetElementsStartingWith("div", "a");
    for (var i = 0; i < arrDivs.length; i++) {
        arrDivs[i].style.backgroundColor = "red";
    }
};

现场测试用例。

如果您在某个时候选择使用 jQuery（仅此一项不值得），所有上述代码都会变成单行：

$(document).ready(function() {
    $('div[id^="a"]').css("background-color", "blue");
});

使用 jQuery 更新小提琴。

于 2012-09-24T15:39:29.440 回答
0

您可以使用querySelectorAll来获取所有具有以 . 开头的 ID 的 div a。然后检查每一个，看它是否包含一个数字。

var aDivs = document.querySelectorAll('div[id^="a"]');
for(var index = 0, len = aDivs.length; index < len; index++){
    var aDiv = aDivs[index];
    if(aDiv.id.match(/a\d+/)){
       // aDiv is a matching div
    }
}​

演示：http: //jsfiddle.net/NTICompass/VaTMe/2/

于 2012-09-24T15:42:46.920 回答
0

好吧，我质疑自己为什么需要选择/获取一个具有随机 ID 的元素。我会假设，你想对每个具有随机 ID 的 div 做一些事情（比如排列或调整它们的大小）。在这种情况下 -> 给你的元素一个类，比如带有随机 ID 的“myGeneratedDivs”（如果你需要它的话）。然后用javascript全选

var filteredResults=document.querySelectorAll(".myGeneratedDivs").filter(function(elem){
    ....
    return true;
});

或使用 jQuery/Zepto/YourWeaponOfChoice

var filteredResults=$(".myGeneratedDivs").filter(function(index){
    var elem=this;
    ....
    return true;
});
于 2012-09-24T15:43:33.147 回答
0

如果您打算使用 jQuery，可以使用以下 jQuery 选择器

div[id^="a"]

或者

$('div[id^="id"]').each(function(){
// your stuff here
});
于 2012-09-24T15:43:48.547 回答
0

不，您需要一个固定的 id 值getElementById才能工作。但是，还有其他方法可以在 DOM 中搜索元素（例如通过 CSS 类）。

于 2012-09-24T15:37:54.600 回答
0

您将必须定位父 div，当有人单击父 div 内的子 div 时，您可以捕获子 div。

 <div id="target">
  <div id="tag1" >tag1</div>
  <div id="tag1" >tag2</div>
  <div id="tag1" >tag3</div>
 </div>

$("#target").on("click", "div", function() {
var showid = $(this).attr('id');
alert(showid)
});
于 2021-03-08T04:34:16.083 回答
-1

getElementById() 将返回指定的确切元素。有许多 JavaScript 框架，包括jQuery，它们允许更强大的选择功能。例如：

  1. 按 id 选择元素：$("#theId")
  2. 按类选择一组元素：$(".class")
  3. 选择子元素：$("ul a.action")

对于您的特定问题，您可以轻松构建适当的选择器。

于 2012-09-24T15:40:21.727 回答