Question

你能帮我制作一个javascript函数：（1）单击两个按钮时，在showarea中显示div内容，（2）如果包含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>

这两个功能是我创造的。替换功能以替换内容，打开以显示或隐藏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（）

如何使用Javascript替换和隐藏Div内容

1 个答案: