如何通過JavaScript更改HTML自定義屬性值？

-4

<div id="e2" 
    class="progress-bar progress-bar-danger active" 
    role="progressbar" data-transitiongoal="45">

而且我想改變在運行時的數據transitiongoal值。

這並沒有爲我工作：

document.getElementById("e2").setAttribute("data-transitiongoal", "10");

來源

2017-03-01 nApSt3r

您是否在文檔加載後運行代碼？例如。使用* window.onload *或腳本在頁面的底部？ – RobG

正如你說，你要在運行時發生變化，你已經嘗試過一個解決方案，將在加載本身改變它，我建議你的事。
請仔細閱讀以瞭解，然後只複製下面的代碼。

設置Timeout function其中改變數據和在函數內部中，爲了避免重複執行清除Timeout。
以毫秒爲單位設置持續時間，以便在多長時間後進行更改。 2000 - > 2秒。 0 - >立即（秒* 1000）。

您可以檢查控制檯和持續時間以檢測更改何時何地出現。

console.log(document.getElementById('e2')); // log actual element -> 45 
 
var SIT=window.setTimeout(function(){ 
 
    document.getElementById("e2").setAttribute("data-transitiongoal", "10"); 
 
    console.log(document.getElementById('e2')); 
 
    window.clearTimeout(SIT); 
 
},2000); // change duration 
 
// log changed element -> 10

<div id="e2" class="progress-bar progress-bar-danger active" role="progressbar" data-transitiongoal="45">Something</div>

來源

2017-03-01 08:42:03

也許你正在做別的錯誤的，因爲setAttribute()作品。你能發佈更多的代碼嗎？見自己：

var elem = document.getElementById("e2"); 
 

 
console.log(elem.getAttribute("data-transitiongoal")); 
 
elem.setAttribute("data-transitiongoal", 10); 
 
console.log(elem.getAttribute("data-transitiongoal"));

<div id="e2" class="progress-bar progress-bar-danger active" role="progressbar" data-transitiongoal="45">

來源

2017-03-01 08:48:23

好吧，我糾正這個問題。我修復了一些其他問題，並開始工作。感謝解決方案的人，它也幫助我。

來源

2017-03-01 14:15:34 nApSt3r

如何通過JavaScript更改HTML自定義屬性值？

回答

相關問題