我试图在一个页面上循环所有元素,所以我想检查存在于这个页面上的一个特殊类的每个元素。
我怎么说我要检查每个元素呢?
我试图在一个页面上循环所有元素,所以我想检查存在于这个页面上的一个特殊类的每个元素。
我怎么说我要检查每个元素呢?
当前回答
从这个链接 javascript参考
<html>
<head>
<title>A Simple Page</title>
<script language="JavaScript">
<!--
function findhead1()
{
var tag, tags;
// or you can use var allElem=document.all; and loop on it
tags = "The tags in the page are:"
for(i = 0; i < document.all.length; i++)
{
tag = document.all(i).tagName;
tags = tags + "\r" + tag;
}
document.write(tags);
}
// -->
</script>
</head>
<body onload="findhead1()">
<h1>Heading One</h1>
</body>
</html>
更新:编辑
自从我的上一个答案,我找到了更好更简单的解决方案
function search(tableEvent)
{
clearResults()
document.getElementById('loading').style.display = 'block';
var params = 'formAction=SearchStocks';
var elemArray = document.mainForm.elements;
for (var i = 0; i < elemArray.length;i++)
{
var element = elemArray[i];
var elementName= element.name;
if(elementName=='formAction')
continue;
params += '&' + elementName+'='+ encodeURIComponent(element.value);
}
params += '&tableEvent=' + tableEvent;
createXmlHttpObject();
sendRequestPost(http_request,'Controller',false,params);
prepareUpdateTableContents();//function js to handle the response out of scope for this question
}
其他回答
最好的解决方案是使用递归:
loop(document);
function loop(node){
// do some thing with the node here
var nodes = node.childNodes;
for (var i = 0; i <nodes.length; i++){
if(!nodes[i]){
continue;
}
if(nodes[i].childNodes.length > 0){
loop(nodes[i]);
}
}
}
与其他建议不同的是,这个解决方案不需要为所有节点创建一个数组,因此内存占用更少。更重要的是,它能发现更多的结果。我不确定这些结果是什么,但在chrome上测试时,它发现比document.getElementsByTagName("*")多50%的节点;
你可以传递一个*给getElementsByTagName(),这样它就会返回页面中的所有元素:
var all = document.getElementsByTagName("*");
for (var i=0, max=all.length; i < max; i++) {
// Do something with the element here
}
请注意,您可以使用querySelectorAll(),如果它可用(IE9+, IE8中的CSS),只查找具有特定类的元素。
if (document.querySelectorAll)
var clsElements = document.querySelectorAll(".mySpeshalClass");
else
// loop through all elements instead
这无疑会加快现代浏览器的速度。
浏览器现在支持NodeList上的foreach。这意味着您可以直接循环元素,而不必编写自己的for循环。
document.querySelectorAll('*').forEach(function(node) {
// Do whatever you want with the node object.
});
性能注意事项-通过使用特定的选择器,尽最大努力确定您正在寻找的范围。通用选择器可以根据页面的复杂程度返回大量节点。另外,考虑使用document.body. queryselectorall而不是document。当你不关心<head> children. querySelectorAll。
对于那些正在使用Jquery的人
$("*").each(function(i,e){console.log(i+' '+e)});
我觉得这真的很快
document.querySelectorAll('body,body *').forEach(function(e) {
你可以试试 document.getElementsByClassName(“special_class”);