gpt4 book ai didi

javascript - 通过 javascript 按钮传递多个元素更改

转载 作者:太空宇宙 更新时间:2023-11-03 18:12:00 25 4
gpt4 key购买 nike

我是 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/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com