dom节点问题
<!doctype html><html lang="en">
<head>
<meta charset="UTF-8" />
<title></title>
<style type="text/css">
</style>
<script type="text/javascript">
window.onload = function()
{
function styleHeaderSibings(){
if(!document.getElementsByTagName)
{
return false;
}
var headers = document.getElementsByTagName("h1");
var elem;
for(var i = 0; i < headers.length; i++)
{
elem = getNextElement(headers.nextSibling);
elem.style.fontWeight = "bold";
elem.style.fontSize = "40px";
elem.style.color = "red";
}
}
}
function getNextElement(node)
{
if(node.nodeType == 1)
{
return node;
}
if(node.nextSibling)
{
return getNextElement(node.nextSilbing);
}
return null;
}
</script>
</head>
<body>
<h1>a</h1>
<h1>b</h1>
<h1>c</h1>
<h1>d</h1>
</body>
</html>
设置了字体等没反应F12也没错,求救 == {:5_99:} 本帖最后由 不二如是 于 2017-5-17 22:35 编辑
先抛开,DOM树遍历方法正确与否不说。。。
居然要对<h1>这中内置好样式的标签修改大小,就很尴尬了!
建议换成<p>标签,然后放在一个div里
在利用便利一个,id为xxx的div下所有子节点的办法,修改<p>样式
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title></title>
<style type="text/css">
</style>
<script type="text/javascript">
var adiv=document.querySelectorAll("#d1 p");
for(i=0;i<adiv.length;i++){
adiv.style.color="red";
adiv.style.fontSize="55px";
}
</script>
</head>
<body>
<div id="try">
<p>a</p>
<p>b</p>
<p>c</p>
<p>d</p>
<p>e</p>
</div>
</body>
</html>
火狐不支持getElementsByTagName这个语句所以也没法调试{:10_269:}
页:
[1]