Javascript 在html中隐藏和显示div块
我是html的初学者，在下面的代码中，我尝试使用div块隐藏和显示内容。我可以隐藏/显示第二个div块，但单击第一个div块时它不起作用！不知道哪里出了问题。任何帮助都将不胜感激Javascript 在html中隐藏和显示div块,javascript,html,Javascript,Html,我是html的初学者，在下面的代码中，我尝试使用div块隐藏和显示内容。我可以隐藏/显示第二个div块，但单击第一个div块时它不起作用！不知道哪里出了问题。任何帮助都将不胜感激 函数隐藏（which） { 如果（！document.getElementById） 回来 if（哪个.style.display==“块”） which.style.display=“无” 其他的 which.style.display=“block” } 现在你看到我了 你好 现在你看到我了 你好 尝试删除a标
函数隐藏（which）
{
如果（！document.getElementById）
回来
if（哪个.style.display==“块”）
which.style.display=“无”
其他的
which.style.display=“block”
}
现在你看到我了
你好
现在你看到我了
你好
尝试删除a标记，然后在div块上添加
onclick="hideshow(document.getElementById('adiv'))"
$("#adiv1") for example
$("#adiv1").hide()
$("#adiv1").show()
尝试删除a标记，然后在div块上添加
onclick="hideshow(document.getElementById('adiv'))"
$("#adiv1") for example
$("#adiv1").hide()
$("#adiv1").show()
您的HTML不正确：
<table>
<tr><td><a href="javascript:hideshow(document.getElementById('adiv1'))"><label class="menuOff" style="font-size: 35px;">Div block 1</label></a></td></tr>
<!-- You can't have a div here -->
<div id="adiv1" style="font:24px bold; display: none;">
<tr>
<td>
<div id="adiv1" style="font:24px bold; display: none;">
</td>
</tr>
同样的问题也适用于第二个div元素您的HTML不正确：
<table>
<tr><td><a href="javascript:hideshow(document.getElementById('adiv1'))"><label class="menuOff" style="font-size: 35px;">Div block 1</label></a></td></tr>
<!-- You can't have a div here -->
<div id="adiv1" style="font:24px bold; display: none;">
<tr>
<td>
<div id="adiv1" style="font:24px bold; display: none;">
</td>
</tr>
同样的问题也适用于第二个div元素我建议您研究JQuery框架提供的
切换我建议您研究JQuery框架提供的
toggle问题不在于javascript，而在于HTML，它是无效的。您的javascript虽然有点奇怪（为什么要检查getElementById是否存在？您使用它来调用函数！），但还可以 问题是你的div漂浮在两个TR的中间。一个表结构是：
<table>
<tr> // a row
<td></td> // one cell
</tr> // end of a row
</table> end of table
//一排
//单细胞
//行尾
桌尾
有趣的是：如果你只修复了第一个DIV，那么第二个DIV将开始不工作。这完全取决于浏览器如何解析无效的HTML，这有点随机。始终关闭标签，并始终确保遵循基本结构。。。就像把TR放在UL中而不是LI中一样（我已经看到了）。问题不在于javascript，而在于HTML，它是无效的。您的javascript虽然有点奇怪（为什么要检查getElementById是否存在？您使用它来调用函数！），但还可以 问题是你的div漂浮在两个TR的中间。一个表结构是：
<table>
<tr> // a row
<td></td> // one cell
</tr> // end of a row
</table> end of table
//一排
//单细胞
//行尾
桌尾
有趣的是：如果你只修复了第一个DIV，那么第二个DIV将开始不工作。这完全取决于浏览器如何解析无效的HTML，这有点随机。始终关闭标签，并始终确保遵循基本结构。。。就像将TR放在UL中而不是LI中（我已经看到了）。html的结构是：
<table> <!-- to delete -->
<div>
<table>
</table>
</div>
<div>
<table>
</table>
</div>
</table> <!-- to delete -->
这是不正确的，当您删除额外的“table”标记时，它工作正常html的结构是：
<table> <!-- to delete -->
<div>
<table>
</table>
</div>
<div>
<table>
</table>
</div>
</table> <!-- to delete -->
这是不正确的，当您删除额外的“table”标记时，它工作正常您在标记嵌套上有一些错误。
下面是标签较少的示例。
两个按钮，每个按钮隐藏/显示不同的div
<!doctype html>
<!-- do not forget to declare type! -->
<html>
<head>
<title> Hide/show div</title>
<script type="text/javascript">
function HideShow(which)
{
if (which.style.display=="block")
which.style.display="none"
else
which.style.display="block"
}
</script>
</head>
<body>
<button onclick = 'HideShow(document.getElementById("div1"));'>Hide/Show div 1</button>
<div id='div1' style='display:block'>This data is in div 1</div>
<br>
<button onclick = 'HideShow(document.getElementById("div2"));'>Hide/Show div 2</button>
<div id='div2' style='display:block'>This data is in div 2</div>
</body>
</html>
隐藏/显示分区
函数隐藏（which）
{
if（哪个.style.display==“块”）
which.style.display=“无”
其他的
which.style.display=“block”
}
隐藏/显示分区1
该数据位于第1部分
隐藏/显示分区2
该数据在第2部分中
下面是标签较少的示例。
两个按钮，每个按钮隐藏/显示不同的div
<!doctype html>
<!-- do not forget to declare type! -->
<html>
<head>
<title> Hide/show div</title>
<script type="text/javascript">
function HideShow(which)
{
if (which.style.display=="block")
which.style.display="none"
else
which.style.display="block"
}
</script>
</head>
<body>
<button onclick = 'HideShow(document.getElementById("div1"));'>Hide/Show div 1</button>
<div id='div1' style='display:block'>This data is in div 1</div>
<br>
<button onclick = 'HideShow(document.getElementById("div2"));'>Hide/Show div 2</button>
<div id='div2' style='display:block'>This data is in div 2</div>
</body>
</html>
隐藏/显示分区
函数隐藏（which）
{
if（哪个.style.display==“块”）
which.style.display=“无”
其他的
which.style.display=“block”
}
隐藏/显示分区1
该数据位于第1部分
隐藏/显示分区2
该数据在第2部分中
slideToggle（）元素