タグにイベントを追加するjs実装方法（クロージャーループを使用）

この記事の例では、js を実装して a タグにイベントを追加する方法を説明します。参考のために皆さんと共有してください。詳細は次のとおりです:

例で説明します:

効果を実現します: ml-praise スタイル クラスを使用して a タグにイベントを追加するループ、および a タグをクリックした後、対応する数値が 1 ずつ増加します。

HTML 構造は次のとおりです:

<ul>
    <li><a href="javascript:;" class="ml-praise">数量：<span class="ding-num">100</span></a></li>
    <li><a href="javascript:;" class="ml-praise">数量：<span class="ding-num">200</span></a></li>
    <li><a href="javascript:;" class="ml-praise">数量：<span class="ding-num">300</span></a></li>
    <li><a href="javascript:;" class="ml-praise">数量：<span class="ding-num">400</span></a></li>
</ul>

JS 実装コード:

function addPraiseNum() {
  var praiseObjs = document.getElementsByClassName('ml-praise');
  for (var i = 0; i < praiseObjs.length; i++) {
 var praiseObj = praiseObjs[i];
 praiseObj.onclick = (function (dingObj) {
   return function () {
 dingObj.innerHTML = parseInt(dingObj.innerHTML) + 1;
   };
 })(praiseObj.getElementsByClassName(&#39;ding-num&#39;)[0]);
  }
}

実装の効果は次のとおりです:

この記事が JavaScript プログラミング設計の皆様のお役に立てれば幸いです。

イベントを a タグに追加するためのその他の js メソッド (クロージャ ループを使用) については、PHP 中国語 Web サイトの関連記事に注目してください。