Question

我正在开展项目，我需要收集div下面的价格值表单

<div>
  <span class="price">
    <span data-currency-iso="BDT">৳</span>
    <span dir="ltr" data-price="21000">21,000.00</span>
  </span>
</div>

我需要帮助才能找到解决方案。

Answer 1

我的建议是让你理解你想要的东西

普通JS

＆＃13;

console.log(
  document.querySelector("span.price span:last-child").getAttribute("data-price")
);

＆＃13;

<div>
  <span class="price">
    <span data-currency-iso="BDT">৳</span>
    <span dir="ltr" data-price="21000">21,000.00</span>
  </span>
</div>

＆＃13;

jQuery版

＆＃13;

console.log(
  $("span.price span:last").data("price")
);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <span class="price">
    <span data-currency-iso="BDT">৳</span>
    <span dir="ltr" data-price="21000">21,000.00</span>
  </span>
</div>

＆＃13;

或$("[data-currency-iso]").next().data('price');

或$(".price").find("[data-price]").data('price');

Answer 2

使用jQuery轻松完成这样的事情。

在<head></head>：

中插入HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

然后：

$('.price [data-price]').data('price');

如果你只是在你的价格div中添加了一个类并且这样做会更好：

$('.price-amount').data('price');

Answer 3

我猜您正在寻找dataset

HTMLElement.dataset属性允许读取和访问写入模式，设置在所有自定义数据属性（data- *）上元素，无论是在HTML中还是在DOM中。

var elem = document.querySelector('[data-price]');
console.log(elem.dataset.price);

var elem = document.querySelector('[data-price]');
console.log(elem.dataset.price);

<div>
  <span class="price">
    <span data-currency-iso="BDT">৳</span>
    <span dir="ltr" data-price="21000">21,000.00</span>
  </span>
</div>

Answer 4

有一种纯粹的javascript方式，使用数据集来查询数据属性。

console.log( document.getElementsByClassName("price")[0].children[1].dataset.price)

<div>
  <span class="price">
    <span data-currency-iso="BDT">৳</span>
    <span dir="ltr" data-price="21000">21,000.00</span>
  </span>
</div>

HTMLElement.dataset属性允许读取和访问写入模式，设置在所有自定义数据属性（data- *）上元素，在HTML或DOM中。 https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/dataset

在javascript中从数据价格中查找价值

4 个答案: