如何將值傳遞給“數據值”

Question

我的網頁上有這個網站： http : //thanglongvn.com

我在同一網頁上有一個標簽。 我希望“數據值”從標簽值而不是硬編碼值中獲取值。

怎么做？ 我如何以編程方式將值傳遞給“數據值”，並將html標記定義為空白，如下所示：

<div class="counter-animated" data-value="span dynamic value here"></div>

<span id="my_IDLabel">dynamic value</span>

Answer 1

您可以像這樣以編程方式設置數據屬性

 var label = document.querySelector('.value') var target = document.querySelector('.target') var output = document.querySelector('.output') output.innerHTML = target.getAttribute('data-value') document .querySelector('button') .addEventListener('click', function() { target.setAttribute('data-value', label.textContent) output.innerHTML = target.getAttribute('data-value') }) 

 <label class="value">Bar</label> <div class="target" data-value="Foo"></div> <br/> <button>change data-value attribute</button> <br/><br/> The data-value attribute is: <br/> <div class="output"></div> 

Answer 2

您可以使用普通的javascript作為element.dataset.datasetname來訪問數據屬性

在這種情況下，它是element.dataset.value，您可以將其設置為element.dataset.value =“ class1”

檢查此片段

 window.onload = function() { var counterClass = document.querySelectorAll('.counter-animated'); alert(counterClass[0].dataset.value); counterClass[0].dataset.value="class1"; } 

 <div class="counter-animated" data-value="span dynamic value here"></div> <span id="my_IDLabel">dynamic value</span> 

希望能幫助到你