我是 JavaScript 的新手,只涉足编辑而不是创作。我正在尝试创建一个按钮,单击该按钮时会隐藏 div,同时显示隐藏的 div。
到目前为止,我很确定第一部分已经通过,即。
onclick="document.getElementById('page1').style.display='none'";`
但不是第二个
"document.getElementById('page2').style.display='block'";
完整代码
<html>
<head>
<meta charset="utf-8">
<style>
#page1 {
display: block;
}
#page2 {
display: none;
}
</style>
</head>
<body>
<div id="page1"> This is page 1
<button type="button"
onclick="document.getElementById('page1').style.display='none'";"document.getElementById('page2').style.display='block'";>link to page 2</button>
</div>
<div id="page2"> This is page 2
<button type="button"
onclick="document.getElementById('page2').style.display='none'";"document.getElementById('page1').style.display='block'";>link to page 2</button>
</div>
</body>
</html>
最佳答案
您可以在一个调用中编写多个 JS 命令,您不必为此放入多个引号。所以所有命令都在一对引号中。
<html>
<head>
<meta charset="utf-8">
<style>
#page1 {
display: block;
}
#page2 {
display: none;
}
</style>
</head>
<body>
<div id="page1"> This is page 1
<button type="button"
onclick="document.getElementById('page1').style.display='none'; document.getElementById('page2').style.display='block'";>link to page 2</button>
</div>
<div id="page2"> This is page 2
<button type="button"
onclick="document.getElementById('page2').style.display='none'; document.getElementById('page1').style.display='block'";>link to page 2</button>
</div>
</body>
</html>
关于javascript - 通过 javascript 按钮传递多个元素更改,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23545484/