对html子节点操作的问题

dtfox 2009-11-12 10:59:02

<html xmlns="http://www.w3.org/1999/xhtml">

	<head>

		<title>test hidden</title>

		<meta http-equiv="content-type" content="text/html; charset=utf-8" />

		<script type="text/javascript">

			

		</script>

	</head>



	<body>

		<dl>

			<dt>onclick</dt>

			<dd><a href="#">small menu1</a></dd>

			<dd><a href="#">small menu2</a></dd>

			<dd><a href="#">small menu3</a></dd>

		</dl>

		<dl>

			<dt>onclick</dt>

			<dd><a href="#">small menu1</a></dd>

			<dd><a href="#">small menu2</a></dd>

			<dd><a href="#">small menu3</a></dd>

		</dl>

	</body>

</html>

onclick来隐藏（显示）dd 标签里的内容。新手，没能写成功。
[不能用到window.onload，不然会出问题。]

请各位前辈指点。分不够再加。

...全文

224 14 打赏收藏转发到动态举报

写回复

用AI写文章

14 条回复

切换为时间正序

请发表友善的回复…

发表回复

YiYanXiYin 2009-11-13

打赏
举报

不要忘了结贴，我是冲着分来的，呵呵

YiYanXiYin 2009-11-13

打赏
举报

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>test hidden </title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script type="text/javascript">
function hidedd(){
var o = event.srcElement;
for(var i =0;i < o.parentNode.childNodes.length;i++)
{
if(o.parentNode.childNodes[i] != o) {
if(o.parentNode.show==1){
o.parentNode.childNodes[i].childNodes[0].style.display = "";
}else{
o.parentNode.childNodes[i].childNodes[0].style.display = "none";
}
}
}
o.parentNode.show==1 ? o.parentNode.show = 0 : o.parentNode.show = 1;
}
</script>
</head>

<body>
<dl>
<dt onclick="hidedd()">onclick </dt>
<dd> <a href="#">small menu1 </a> </dd>
<dd> <a href="#">small menu2 </a> </dd>
<dd> <a href="#">small menu3 </a> </dd>
</dl>
<dl>
<dt onclick="hidedd()">onclick </dt>
<dd> <a href="#">small menu1 </a> </dd>
<dd> <a href="#">small menu2 </a> </dd>
<dd> <a href="#">small menu3 </a> </dd>
</dl>
</body>
</html>

dtfox 2009-11-12

打赏
举报

[Quote=引用 7 楼 yiyanxiyin 的回复:]
我想楼主不是要点dt隐藏所有的dd里面的内容吧，而是点某个dt隐藏同级的dd内容

上面的代码按这个思路来的
[/Quote]

是这样的，初始状态为隐藏，并且你这个好像不能循环的嘛。

YiYanXiYin 2009-11-12

打赏
举报

我想楼主不是要点dt隐藏所有的dd里面的内容吧，而是点某个dt隐藏同级的dd内容

上面的代码按这个思路来的

YiYanXiYin 2009-11-12

打赏
举报

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>test hidden</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script type="text/javascript">
function hidedd(){
var o = event.srcElement;
for(var i =0;i< o.parentNode.childNodes.length;i++)
{
if(o.parentNode.childNodes[i] != o)
o.parentNode.childNodes[i].childNodes[0].style.display = "none";
}
}
</script>
</head>

<body>
<dl>
<dt onclick="hidedd()">onclick</dt>
<dd><a href="#">small menu1</a></dd>
<dd><a href="#">small menu2</a></dd>
<dd><a href="#">small menu3</a></dd>
</dl>
<dl>
<dt onclick="hidedd()">onclick</dt>
<dd><a href="#">small menu1</a></dd>
<dd><a href="#">small menu2</a></dd>
<dd><a href="#">small menu3</a></dd>
</dl>
</body>
</html>

dtfox 2009-11-12

打赏
举报

<html xmlns="http://www.w3.org/1999/xhtml">

    <head>

        <title>test hidden</title>

        <meta http-equiv="content-type" content="text/html; charset=utf-8" />

        <script type="text/javascript">

            

        </script>

    </head>



    <body>

        <div id="nav"><dl>

            <dt>onclick</dt>

            <dd><a href="#">small menu1</a></dd>

            <dd><a href="#">small menu2</a></dd>

            <dd><a href="#">small menu3</a></dd>

        </dl>

        <dl>

            <dt>onclick</dt>

            <dd><a href="#">small menu1</a></dd>

            <dd><a href="#">small menu2</a></dd>

            <dd><a href="#">small menu3</a></dd>

        </dl></div>

    </body>

</html>

zwp315 2009-11-12

打赏
举报

upupupupup

dtfox 2009-11-12

打赏
举报

那不是我每个dl都要不能的ID？

因为我的dl很多的。

ivws_19 2009-11-12

打赏
举报

给dl加个id
onclick时
var dl=document.getElementById("dlid");
var a=dl.document.getElementsByTagName("a");
for(var i=0;i<a.length;i++){
a[i].style.display=''; //或者 a[i].style.display='none',显隐自己控制
}

li1229363 2009-11-12

打赏
举报

<a onclick="display(this)">onclick</a>



function display(obj){

 if(!obj.style.display=="")

 {

  obj.style.display="none";

 else{

  obj.style.display="";

 }

}

dtfox 2009-11-12

打赏
举报

谁帮我再修改修改。
谢谢。

dtfox 2009-11-12

打赏
举报

<html xmlns="http://www.w3.org/1999/xhtml"> 

    <head> 

        <title>test hidden </title> 

        <meta http-equiv="content-type" content="text/html; charset=utf-8" /> 

	<style>

		<!--

		.aa dd {display:"none";}

		-->

	</style>

        <script type="text/javascript"> 

		function menu() {

			var o = event.srcElement;

			for(var i=0; i<o.parentNode.childNodes.length; i++)

			{

				if(o.parentNode.childNodes[i] != o)

					o.parentNode.childNodes[i].childNodes[0].style.display="block";

			}

		}

        </script> 

    </head> 



    <body> 

	    <div class=aa><dl> 

            <dt onclick="menu()">onclick </dt> 

            <dd> <a href="#">small menu1 </a> </dd> 

            <dd> <a href="#">small menu2 </a> </dd> 

            <dd> <a href="#">small menu3 </a> </dd> 

        </dl> 

        <dl> 

            <dt onclick="menu()">onclick </dt> 

            <dd> <a href="#">small menu1 </a> </dd> 

            <dd> <a href="#">small menu2 </a> </dd> 

            <dd> <a href="#">small menu3 </a> </dd> 

	</dl></div> 

    </body> 

</html>