查找父元素和子元素

<! 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 >

转载于:https://www.cnblogs.com/askyes/archive/2008/03/29/1128532.html