Question

我遇到了jQuery部分的问题：

HTML 的

<div>
xxxxxxxxx
    <div>
        <ul>
            <li><button class="addnum">xxxx</button></li>
        </ul>
    </div>              
</div>

<div class="num">
    12345
</div>

脚本

$(".addnum").click(function() {
    var pur = $(this).siblings(".num").clone();
});

我正在尝试克隆“.num”中的值，即12345。我该如何选择它？

*编辑：对不起，我没有提到我有多个“.num”元素，我一次只能克隆1个，每个数字都有不同的值，我需要能够单独选择它们。但是谢谢大家的答案！

Answer 1

只需使用$("div.num")，如果您的目标元素具有唯一的类或ID，则无需使用复杂的选择器来导航DOM。

Answer 2

@Arvind，代码应该可以工作。

但是我建议您将HTML包装在容器中，然后使用.closest()和.find()的组合以提高可维护性。

 var pur = $(this).closest('.container').find(".num").text();

$(document).ready(function() {
  $(".addnum").click(function() {
    var pur = $(this).closest('.container').find(".num").text();
    alert(pur)
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class='container'>
  <div>
    xxxxxxxxx
    <div>
      <ul>
        <li>
          <button class="addnum">xxxx</button>
        </li>
      </ul>
    </div>
  </div>

  <div class="num">
    12345
  </div>

</div>

Answer 3

该按钮没有兄弟姐妹，它在UL和DIV元素中。您可以使用DOM层次结构（使用parent（）方法），一旦达到正确的级别，就可以选择带有类的元素.num

var num =$('.addnum').parent().parent().parent().parent().children().children('.num').text();

那应该给你div里面的文字。

Answer 4

尝试closest()，next()和parent()：

var num =$(this).closest('div').parent().next(".num").text();

工作原理：

<div><!-- parent of closest div of `.addnum` -->
    xxxxxxxxx
    <div><!-- closest div of `.addnum` -->
        <ul>
            <li>
              <button class="addnum">xxxx</button>
            </li>
        </ul>
    </div>               </div>
<!-- next `.num` to parent of closest div of `.addnum` -->
<div class="num">12345</div>

如何获取此邻近元素的值？

4 个答案: