<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>查找父元素和子元素</title>
<script lanuage="JavaScript">
function FindParentElement(element, tagName)
{
while(element != null && element.tagName != tagName )
{
element = element.parentElement;
if ( element != null && element.tagName == tagName )
{
//element.style.display="none";
//alert(element.tagName);
elem=FindChildElement(element,"UL");
if(elem.style.display!="none")
{
elem.style.display="none"
}
else
{
elem.style.display="block"
}
}
}
return null;
}
</script>
<script lanuage="JavaScript">
function FindChildElement(element, tagName)
{
var isFounded = false;
var elements = element;
var result = element;
if ( element.tagName == tagName )
{
return element;
}
while(!isFounded && elements != null && result != null && result.tagName != tagName)
{
elements = elements.childNodes;
for( var i=0 ; elements != null && i < elements.length ; i++ )
{
result = elements.item(i);
var result2 = FindChildElement(result, tagName);
if ( result == null || result2 == null )
{
continue;
}
if ( result.tagName == tagName || result2.tagName == tagName )
{
if ( result2.tagName == tagName )
{
result = result2;
}
isFounded = true;
break;
}
}
}
if ( isFounded )
{
return result;
}
else
{
return null;
}
}
</script>
</head>
<body>
<div class="col-box">
<h3>商品分类</h3>
<div id="navcontainer" style="display:block">
<ul>
<li><a href="#" onclick="FindParentElement(this,'LI');"><strong>化妆品</strong></a>
<ul>
<li><a href="category.php?id=34">沐浴</a></li>
<li><a href="category.php?id=35">套装</a></li>
<li><a href="category.php?id=25">护肤品</a></li>
<li><a href="category.php?id=31">洗发</a></li>
<li><a href="category.php?id=33">美发</a></li>
</ul>
</li>
</ul>
<ul>
<li><a href="category.php?id=2"><strong>通讯</strong></a>
<ul>
<li><a href="category.php?id=24">手机</a></li>
</ul>
</li>
</ul>
<ul>
<li><a href="category.php?id=14"><strong>书籍</strong></a>
<ul>
<li><a href="category.php?id=23">文学</a></li>
</ul>
</li>
</ul>
<ul>
<li><a href="category.php?id=17"><strong>硬件</strong></a>
</li>
</ul>
<ul>
<li><a href="category.php?id=19"><strong>宠物</strong></a>
</li>
</ul>
<ul>
<li><a href="category.php?id=15"><strong>玩具</strong></a>
</li>
</ul>
<ul>
<li><a href="category.php?id=20"><strong>游戏</strong></a>
</li>
</ul>
<ul>
<li><a href="category.php?id=13"><strong>数码</strong></a>
<ul>
<li><a href="category.php?id=22">电子词典</a></li>
</ul>
</li>
</ul>
<ul>
<li><a href="category.php?id=16"><strong>服装</strong></a>
</li>
</ul>
<ul>
<li><a href="category.php?id=18"><strong>家电</strong></a>
</li>
</ul>
</div>
</div>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>查找父元素和子元素</title>
<script lanuage="JavaScript">
function FindParentElement(element, tagName)
{
while(element != null && element.tagName != tagName )
{
element = element.parentElement;
if ( element != null && element.tagName == tagName )
{
//element.style.display="none";
//alert(element.tagName);
elem=FindChildElement(element,"UL");
if(elem.style.display!="none")
{
elem.style.display="none"
}
else
{
elem.style.display="block"
}
}
}
return null;
}
</script>
<script lanuage="JavaScript">
function FindChildElement(element, tagName)
{
var isFounded = false;
var elements = element;
var result = element;
if ( element.tagName == tagName )
{
return element;
}
while(!isFounded && elements != null && result != null && result.tagName != tagName)
{
elements = elements.childNodes;
for( var i=0 ; elements != null && i < elements.length ; i++ )
{
result = elements.item(i);
var result2 = FindChildElement(result, tagName);
if ( result == null || result2 == null )
{
continue;
}
if ( result.tagName == tagName || result2.tagName == tagName )
{
if ( result2.tagName == tagName )
{
result = result2;
}
isFounded = true;
break;
}
}
}
if ( isFounded )
{
return result;
}
else
{
return null;
}
}
</script>
</head>
<body>
<div class="col-box">
<h3>商品分类</h3>
<div id="navcontainer" style="display:block">
<ul>
<li><a href="#" onclick="FindParentElement(this,'LI');"><strong>化妆品</strong></a>
<ul>
<li><a href="category.php?id=34">沐浴</a></li>
<li><a href="category.php?id=35">套装</a></li>
<li><a href="category.php?id=25">护肤品</a></li>
<li><a href="category.php?id=31">洗发</a></li>
<li><a href="category.php?id=33">美发</a></li>
</ul>
</li>
</ul>
<ul>
<li><a href="category.php?id=2"><strong>通讯</strong></a>
<ul>
<li><a href="category.php?id=24">手机</a></li>
</ul>
</li>
</ul>
<ul>
<li><a href="category.php?id=14"><strong>书籍</strong></a>
<ul>
<li><a href="category.php?id=23">文学</a></li>
</ul>
</li>
</ul>
<ul>
<li><a href="category.php?id=17"><strong>硬件</strong></a>
</li>
</ul>
<ul>
<li><a href="category.php?id=19"><strong>宠物</strong></a>
</li>
</ul>
<ul>
<li><a href="category.php?id=15"><strong>玩具</strong></a>
</li>
</ul>
<ul>
<li><a href="category.php?id=20"><strong>游戏</strong></a>
</li>
</ul>
<ul>
<li><a href="category.php?id=13"><strong>数码</strong></a>
<ul>
<li><a href="category.php?id=22">电子词典</a></li>
</ul>
</li>
</ul>
<ul>
<li><a href="category.php?id=16"><strong>服装</strong></a>
</li>
</ul>
<ul>
<li><a href="category.php?id=18"><strong>家电</strong></a>
</li>
</ul>
</div>
</div>
</body>
</html>
