如何使用Java腳本替換和隱藏Div內容

Question

您能幫我做一個javascript函數嗎：（1）單擊兩個按鈕時，在showarea中顯示div內容；（2）如果showshow中包含show1 / show2的內容，則替換showarea中的內容；（3）隱藏內容。

場景：單擊SUB按鈕時，它將Show1的內容顯示到ShowArea中，但是當單擊DOM按鈕時，它將替換ShowArea的內容Show1，並顯示Show2的內容。 但是，當再次單擊DOM按鈕時，它將隱藏ShowArea及其邊框。

這是示例代碼：

<div id="credentials">
  <div id="user">
    <button id="button" type="button" onclick="Open('Show1');">SUB</button> 
    <br>
    <button type="button" onclick="replace('Show1','Show2')">DOM</button>
  </div>
</div>

<div id="showarea" style="border: 2px solid #365278">
  <div id="studentlogin">
    <div id = "Show1">
        <form name="form" method="get" action="studenthome.html" onclick="replace()" onsubmit="return validateStudent(this)">
            Enter your ID NUMBER<br><input type="text" name="student" id="studentID" /><br>
            <input type="submit" value="Log-in" >       
        </form>
    </div>
  </div>

<div id="facultylogin">
<div id = "Show2">
<form name="form" method="get" action="facultyhome.html" onclick="replace()" onsubmit="return validateFaculty(this)">
Enter your FACULTY ID <br><input type="text" name="faculty" id="facultyID" /><br>
<input type="submit" value="Log-in" >   
</form>

</div>
</div>  
</div>
</div>

這是我創建的兩個函數。 replace函數替換內容，然后單擊Open打開以顯示或隱藏div。 但是replace（）僅適用於DOM。

function replace(id,content) { 
var container = document.getElementById(id); 
container.innerHTML = content; 
} 
function Open(idMyDiv){ 
var objDiv = document.getElementById(idMyDiv); 
if(objDiv.style.display == "inline"){ 
objDiv.style.display = "none"; 
} else { 
objDiv.style.display = "inline"; 
}

謝謝

Answer 1

我假設這是“作業分配”，因此僅提示：Node.replaceChild（）如果您使用的是jQuery之類的庫：jQuery.replaceWith（）