我正在尝试在没有 Jquery 的情况下执行此操作。我想在单击触发器时显示一个 div。到目前为止，我有这个来隐藏元素。
document.getElementById('element').style.display = 'none';
HTML..
<div class="element">Ahem, boo!!</div>
<a href="#" id="showDiv">Show</a>
单击链接时如何创建显示 div 的函数？我想避免使用onclick="showDiv()链接本身的功能。
document.getElementById('showDiv').onclick=function(){
// Remove any element-specific value, falling back to stylesheets
document.getElementById('element').style.display='';
};
可以完全在 JavaScript 中附加事件处理程序。例子：
document.getElementById('showDiv').onclick = function() {
// Do whatever now that the user has clicked the link.
};
要反转您发布的第一行代码的效果，您可以使用：
document.getElementById('element').style.display = 'block'; // or
document.getElementById('element').style.display = '';
将此添加到脚本中：
function myFunction() {
var btn = document.getElementById("myButton");
//to make it fancier
if (btn.value == "Click To Open") {
btn.value = "Click To Close";
btn.innerHTML = "Click To Close";
}
else {
btn.value = "Click To Open";
btn.innerHTML = "Click To Open";
}
//this is what you're looking for
var x = document.getElementById("myDIV");
if (x.style.display === "none") {
x.style.display = "block";
} else {
x.style.display = "none";
}
}
并编辑按钮和div：
<button onclick="myFunction()" id="myButton" value="Click To Open Instructions">Click To Open Instructions</button>
<div style="display:none;" id="myDIV">
</div>