通过js获取<div>下层层嵌套的内容:
最近一个问题困扰了我很久,不得解决,今日得朋友指点,豁然开朗,此处遥谢朋友一声!
问题描述:
一个注册页面中的一个form表单下两个子项,单击其中一个,另一个隐藏,提交时判断是哪一个子项时总是获取不到判断依据的内容。源码不再赘述,此处简记一下。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> .div1{} .span1{} .span2{} .span3{} .a1{} .a2{} .a3{} </style> <script src="js/jquery-1.11.1.min.js"></script> </head> <body> <div class="div1"> <span class="span1"><a class="a1" href="javascript:;">第一个span中a标签内容</a></span> <span class="span2"><a class="a2" href="javascript:;">第二个span中a标签内容</a></span> <span class="span3"><a class="a3" href="javascript:;">第三个span中a标签内容</a></span> </div> <script type="text/javascript"> alert("第一弹:" + $(".div1 span a.a1").text()); //可以获得a标签中的内容 alert("第二弹:" + $(".div1 span .a1").text()); //可以获得a标签中的内容 alert("第三弹:" + $(".div1 span a .a1").text()); //空白 </script> </body> </html>
要获取<div>中<span>里<a>内的文本内容,第一弹和第二弹都可以实现,此处推荐第一弹的写法,意思明了。
易错点是第一弹和第三弹,只有一个【空格】的差别,第三弹的写法是获取不到内容的!
熟悉js的朋友可以忽略,本人对js了解不多,碰到问题记一下,当作前车之鉴!