如何使用jQuery在div内选择一个标签？

Question

我的dom结构如下：

<div class="edit-section slideDown">
  <form>
  <div class="info-header">
    <div class="acct-section-title clearfix">
      <h3 class="acct-section-title-txt pull-left">Meals</h3>
      <button type="button" class="pull-right btn-close icon-close"></button>
    </div>
  </div>
  <div id="flash-msg"></div>


  <ul class="info-list info-list-form">

    <div class="col-sm-4 info-label"><label for="delivery_name">Name</label></div>
    <div class="col-sm-8 info-value">
      <div class="form-group mb-0">
        <input type="text" name="delivery_name" id="delivery_name" class="form-input">
      </div>
      ...

我该如何使用jQuery来检查底部的输入是否具有以下dom元素: Name 最好的检查方法是什么? $('.edit-section')可以让我获取外部元素，但是如何获取标签呢?

- Jwan622

Answer 1

你可以使用find找到它。 检查以下代码片段。

console.log($(".edit-section").find("label[for =delivery_name]").text());

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="edit-section slideDown">

  <div class="info-header">
    <div class="acct-section-title clearfix">
      <h3 class="acct-section-title-txt pull-left">Meals</h3>
      <button type="button" class="pull-right btn-close icon-close"></button>
    </div>
  </div>
  <div id="flash-msg"></div>


  <ul class="info-list info-list-form">

    <div class="col-sm-4 info-label">
      <label for="delivery_name">Name</label>
    </div>
    <div class="col-sm-8 info-value">
      <div class="form-group mb-0">
        <input type="text" name="delivery_name" id="delivery_name" class="form-input">
      </div>

    </div>

- Geeky

---

这是不是与 $('.edit-section label[for="delivery_name"]') 是同一件事？ - Jwan622

是的，它是一样的...查找正在编辑部分中寻找子元素。 - Geeky

Answer 2

如何获取label标签？

最简单的方法是：

$('label[for="delivery_name"]');

如何使用jQuery检查底部输入框是否有标签？

如果$('label[for="delivery_name"]').length < 1，那么它不存在。

- Rounin - Standing with Ukraine

Answer 3

您可以直接定位到标签$('.edit-section label[for="delivery_name"]')

。

- Yehuda Schwartz

Answer 4

您需要使用find和closest函数。

请尝试这样做：

$('#delivery_name').closest('ul').find('label')

- Mihai Alexandru-Ionut

---

“find”和“$('.edit-section label[for="delivery_name"]')”是一样的吗？ - Jwan622

@Jwan622，是的。.find()方法允许我们在DOM树的后代中搜索并从匹配的元素构造一个新的jQuery对象。 - Mihai Alexandru-Ionut

此外，当您有许多info-list类时，closest()函数非常有用。 - Mihai Alexandru-Ionut

Answer 5

你可以使用jQuery直接访问delivery_name。

$('#delivery_name')

文档在这里：https://api.jquery.com/

- Programmer

---

鼓励提供外部资源链接，但请添加上下文说明链接的内容和目的。在引用重要链接时，请引用最相关的部分，以防目标站点无法访问或永久离线。 - pableiros