当前位置: 代码迷 >> JavaScript >> 求圣人帮忙!原生JS 怎样获取元素的子元素。学习JS,不想用jQuery
  详细解决方案

求圣人帮忙!原生JS 怎样获取元素的子元素。学习JS,不想用jQuery

热度:55   发布时间:2013-10-24 18:27:21.0
求高人帮忙!原生JS 怎样获取元素的子元素。学习JS,不想用jQuery
先贴一下HTML结构

Ul 嵌套结构,然后小弟想要的效果,就是我写汉字的那个a 标签在新的窗口打开,即设置属性target="_blank",知道jQuery 的确方便,我也实现了,就是想知道如果要换成原生的JavaScript该怎样写,
麻烦大神来帮忙下,最好能在解释下代码,小弟跪求啊。新手来学。



<ul id="menu">
<li>
<a href="http://www.baidu.com">aaaaa</a>
<ul class="sub-menu">
<li><a href="">bbbb</a></li>
<li><a href="">bbbbb</a></li>
</ul>
</li>
<li><a href="">aaaaa</a></li>
<li><a href="">aaaa</a></li>
<li><a href="">aaaaa</a></li>
<li>
<a href="http://www.google.com.hk">想把这里设置新窗口</a>
<ul class="sub-menu">
<li><a href="">bbbb</a></li>
<li><a href="">bbbbbb</a></li>
</ul>
</li>
<li><a href="">aaaa</a></li>
</ul>
javascript 子元素获取

------解决方案--------------------

window.onload=function(){
var links=document.getElementsByTagName('a')
for(var i=0;i<links.length;i++){  //遍历所有A标签
  if( links[i].href=="http://www.google.com.hk" ){  // href="http://www.google.com.hk" 
     links[i].target="_blank"
  }

}
}



------解决方案--------------------
你应该限制好条件:
1.是id=menu下的所有a标签的第N个a ?
2.是id=menu下a href中含有www.google.com?
3.还是id=menu下a中含全部是中文?
……
有了条件才知道你要哪个。
------解决方案--------------------
<ul id="menu">
    <li>
        <a href="http://www.baidu.com">aaaaa</a>
        <ul class="sub-menu">
            <li><a href="">bbbb</a></li>
            <li><a href="">bbbbb</a></li>
        </ul>
    </li>
    <li><a href="">aaaaa</a></li>
    <li><a href="">aaaa</a></li>
    <li><a href="">aaaaa</a></li>
    <li>
        <a href="http://www.google.com.hk">想把这里设置新窗口</a>
        <ul class="sub-menu">
            <li><a href="">bbbb</a></li>
            <li><a href="">bbbbbb</a></li>
        </ul>
    </li>
    <li><a href="">aaaa</a></li>
</ul>
<script>
var links = document.getElementById('menu').getElementsByTagName('a');
for(var i=0;i<links.length;i++){  //遍历所有A标签
  if( links[i].href=="http://www.google.com.hk/" ){ 
     links[i].target="_blank"
  }
}
alert(document.getElementById('menu').innerHTML);
</script>

------解决方案--------------------


对子元素的操作.
------解决方案--------------------
引用:
Quote: 引用:

小弟弟,用jquery怎么写。


$('.menu > li').eq(-2).children('a').attr('target','_blank');


获取 class是menu的元素
获取子元素中所有 li 元素 中的倒数 第2个
设置他的 target 为 _blank

请翻译成js代码 基本很朴素了
  相关解决方案