記得之前的原始狀態「單擊」

Question

有一個按鈕（實際上他們中的很多），它有一個事件處理程序：

el.onclick = function(){ 
    if(this.className.indexOf("minimized") != -1){ 
     this.firstChild.nodeValue = 'turn back'; 
     this.className = this.className.replace("minimized", 'expanded'); 
    } 
    else if(this.className.indexOf("expanded") != -1){ 
     this.firstChild.nodeValue = 'what was there before the first click'; 
     this.className = this.className.replace("expanded", 'minimized'); 
    } 
} 

處理器改變了按鈕的狀態。

在第一次點擊當前按鈕之前記住文本節點的標準方式（模式），並在第二次點擊（同一按鈕上）時返回它？

---

你還記得JavaScript變量中的文本節點，而不是用於存儲信息HTML元素嗎？

沒有使用全局變量。

Answer 1

您可以創建元素本身的屬性，例如：

el.onclick = function(){ 
    if(this.className.indexOf("minimized") != -1){ 
     this.originalText = this.firstChild.nodeValue; //store original 
     this.firstChild.nodeValue = 'turn back';  //change it 
     this.className = this.className.replace("minimized", 'expanded'); 
    } 
    else if(this.className.indexOf("expanded") != -1){ 
     this.firstChild.nodeValue = this.originalText; //restore it 
     this.className = this.className.replace("expanded", 'minimized'); 
    } 
} 

Answer 2

你可以使用一個功能？

<div id="test" class='minimized'>what was there before the first click</div> 

<script type="text/javascript"> 
function f(el) { 
    var val = el.firstChild.nodeValue; 
    return function() { 
     if(this.className.indexOf("minimized") != -1){ 
      this.firstChild.nodeValue = 'turn back'; 
      this.className = this.className.replace("minimized", 'expanded'); 
     } 
     else if(this.className.indexOf("expanded") != -1){ 
      this.firstChild.nodeValue = val; 
      this.className = this.className.replace("expanded", 'minimized'); 
     } 
    } 
} 

window.onload=function() { 
    var el = document.getElementById('test'); 
    el.onclick = f(el); 
} 
</script>