[英]How to toggle the innerHTML of element on click
如何使用純JS在點擊時切換元素的innerHTML?
(function(){
var div = document.getElementById("hook");
div.addEventListener("click", function(){
div.innerHTML = "I've been clicked";
}, false);
})();
最簡單的方法(向您展示其背后的想法):
(function(){
var div = document.getElementById("hook");
div.addEventListener("click", function(){
var state1 = document.getElementById('t1').value;
var state2 = document.getElementById('t2').value;
if ( div.innerHTML == state1 ) {
div.innerHTML = state2;
}
else if ( div.innerHTML == state2 ) {
div.innerHTML = state1;
}
// add as many dynamic values as you wish here
else {
// to be on the safe side
div.innerHTML = state1;
}
}, false);
})();
如果您希望它更有效,請引入布爾變量來表示當前狀態。
嘗試這個
(function(){
var div = document.getElementById("hook");
var curText = div.innerText;
div.addEventListener("click", function(){
if(this.innerText == curText){
div.innerText = "I've been clicked";
}
else{
div.innerText = curText;
}
}, false);
})();
這是jsfiddle
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.