小编kyl*_*laz的帖子

单击按钮时使用属性更改 div HTML 内容

我在按钮上有一些数据属性,当单击这些按钮时,我需要将它们作为内容发送到 div。到目前为止我的代码的一部分是这样的:

function getDiscount() {

  var buttons = document.querySelectorAll(".form-button");

  buttons.forEach(function(item, index) {
    item.addEventListener('click', function() {
      var discount = getDiscount(this);
    });
  });

  function getDiscount(clicked_element) {
    var val = clicked_element.getAttribute("data-discount");
    return val;
  }
};
Run Code Online (Sandbox Code Playgroud)
<div class="discount__Topics">
<div><strong class="discount-amount">50</strong>%</div>

<div class="offers"> 
  <button class="form-button" data-discount="38">Offer 1</button>
  <button class="form-button" data-discount="50">Offer 2</button>
  <button class="form-button" data-discount="22">Offer 3</button>
  <button class="form-button" data-discount="88">Offer 4</button>
</div>
</div>

<div class="discount__Topics">
<div><strong class="discount-amount">60</strong>%</div>

<div class="offers"> 
  <button class="form-button" data-discount="12">Offer 1</button>
  <button class="form-button" data-discount="32">Offer 2</button>
  <button class="form-button" data-discount="44">Offer 3</button>
  <button class="form-button" data-discount="55">Offer 4</button>
</div>
</div> …
Run Code Online (Sandbox Code Playgroud)

html javascript custom-data-attribute

1
推荐指数
1
解决办法
623
查看次数

标签 统计

custom-data-attribute ×1

html ×1

javascript ×1