js获取<div>中的内容信息

通过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了解不多，碰到问题记一下，当作前车之鉴！

posted @ 2020-08-16 21:40  我有两个皮夹克  阅读(4491)  评论(0)  编辑  收藏  举报