如何遍历div中的ul元素并在提交时逐个隐藏它们？
在前端开发中，要遍历div中的ul元素并在提交时逐个隐藏它们，可以使用JavaScript来实现。以下是一个示例代码：
<!DOCTYPE html>
<html>
<head>
<title>遍历div中的ul元素并隐藏</title>
</head>
<body>
<div id="myDiv">
<ul>
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
</ul>
<ul>
<li>列表项4</li>
<li>列表项5</li>
<li>列表项6</li>
</ul>
</div>
<button onclick="hideULs()">提交</button>
<script>
function hideULs() {
var div = document.getElementById("myDiv");
var uls = div.getElementsByTagName("ul");
for (var i = 0; i < uls.length; i++) {
uls[i].style.display = "none";
}
}
</script>
</body>
</html>在上述代码中，我们首先通过getElementById方法获取到id为"myDiv"的div元素。然后，使用getElementsByTagName方法获取到div中所有的ul元素，返回一个ul元素的集合。接下来，使用for循环遍历ul元素的集合，并将每个ul元素的display属性设置为"none"，即隐藏它们。最后，我们在页面中添加一个按钮，当点击按钮时，调用hideULs函数隐藏ul元素。
这种方法适用于需要在提交表单时隐藏特定ul元素的场景，例如在表单中有多个选项卡，每个选项卡对应一个ul元素，用户选择某个选项卡后，其他选项卡的内容需要隐藏。
相关·内容
1回答
在我使用express的节点应用程序中，我有一个视图函数，它创建一个非活动公司的列表，每个公司都有两个提交输入类型“活动”和“删除”。我希望能够点击提交，并使个人的ul成为隐藏。但是，我不太确定如何逐个迭代。每次我尝试的时候，我都会隐藏所有的元素。下面是我的view函数： function inactiveFiltered(companyObje
浏览 12提问于2019-12-17得票数 0
回答已采纳
我想我有几个div到10，我想自动添加其中一个并在特定元素悬停时显示它，我认为我不能将它们逐个添加到元素中并逐个隐藏它们，然后使用:hover再次显示它们<div class="info1"></div><div clas
浏览 3提问于2013-04-06得票数 0
回答已采纳
所以我试图在Chrome中创建一个扩展(我正在做的一个项目的原型)，它针对任何网页的所有<div>标签，隐藏它们，或者更确切地说，直到用户单击鼠标才显示它们(下面将进一步解释)。因此，在浏览器中输入一个url会产生一个白色页面。用户单击鼠标，出现第一个<div> (可能是主菜单或主菜单)。用户再次单击，将出现第二个<div>。我已经到了可以隐藏或显示所有<<
浏览 5提问于2010-06-07得票数 0
回答已采纳
7回答
我试图一次循环遍历一些兄弟元素，但我无法将该过程与一次性遍历所有匹配元素的过程分开。这必须是动态的，因为项目列表将会变化，并且不会总是相同的大小。/div> <ul> <li><
浏览 0提问于2018-01-20得票数 2
当某个DIV被隐藏时，触发函数的最佳方式是什么？<div id="flashContainer> // flash object </div>
$("#flashContaine
浏览 1提问于2011-01-14得票数 2
回答已采纳
因此，在实际的应用程序中，对于要删除的每个文件，您将下拉列表，选择该文件，它将被删除，下拉列表将关闭。然后，如果您想要删除另一个文件，则必须再次删除它并选择另一个文件。我想要的是列表保持下来，这样您就可以单击一个又一个文件来删除多个文件。若要关闭列表，请再次单击下拉箭头。
有人认为使用jQuery来实现这种行为吗？我试过愚弄selectedIndex，但当它关闭时，它只控制下拉列表中显示的项。
浏览 2提问于2013-09-10得票数 1
回答已采纳
4回答
表单中的ul未发送到$_POST
、、、、
我的表单中有这个ul <div class="tabs"> <li class="dot clicked radio_buttons"
浏览 2提问于2011-05-03得票数 4
回答已采纳
3回答
jQuery如何将一个类逐个添加到元素中，并在单击#按钮时稍有延迟？不是一次添加所有元素的类，而是一个接一个地添加。请帮帮忙。提前谢谢。<ul id="scroll-set"><li class="imVisible ">Antioch&l
浏览 0提问于2012-09-21得票数 1
我有一个html结构，用于这样的导航。它动态地创建导航。<div class="main"> <li> <div class">
<div class="cbp-hrsub-inner"
浏览 1提问于2015-02-06得票数 0
回答已采纳
1回答
我有这个元素菜单，当其中一个具有类关闭更改的元素使用Jquery打开时，最好的方法是将最后一个div元素从隐藏更改变为可见，我想要的是当我单击其中一个li并将其从closed更改为，我想更改动态ul以显示任何元素或块，是否需要遍历所有元素并检查它们的类？
<ul class="level1&q
浏览 3提问于2022-04-14得票数 0
回答已采纳
2回答
对于一个基本的HTML表单，我想将表单分成三个选项卡，每个选项卡都包含特定的字段，当提交表单时，我希望这三个表单中的所有数据都能提交。="tab3 displayNone"></div>1)我希望能够提交整个表单(三个div中</
浏览 3提问于2012-09-17得票数 14
回答已采纳
我有大约40个a元素和div嵌套在li中。<ul id=ul> <li><a href="#">Link</a><div>Text<
浏览 3提问于2011-02-25得票数 0
回答已采纳
我有下面的jQuery和HTML，当输入的焦点丢失时，它们会隐藏搜索结果。
当单击#searchResult上的元素时，这段代码用id #searchResult隐藏了div。当单击 div上的元素时，我希望禁用模糊。基本上，我想在焦点丢失时隐藏<div id="searchResult">，并在
浏览 6提问于2017-10-13得票数 9
回答已采纳
> </ul> </ul> </ul> </ul>
<div id="list"><&#
浏览 14提问于2016-08-03得票数 0
回答已采纳
>
一些上下文:当您单击li元素时，应该同时隐藏父元素上的ul，并在Report组件中打开modal。然而，目前它只隐藏ul元素。
当我单击父元素中的li元素时，函数handleClick确实会被调用，但是单击Report组件中</em
浏览 4提问于2022-09-13得票数 0
我有一个场景，在这个场景中，我必须遍历所有的子元素，并检查是否有特定的类可用。如果是可用的，那么隐藏特定的元素。这是我的html代码： <ul class="nav navbar-nav">
<li class="topnav"><&#x
浏览 2提问于2017-03-29得票数 1
回答已采纳
3回答
我想在单击li.bc-cate-has-child.first时显示元素a.bc-pagination-next，并在单击a.bc-pagination-next时隐藏它。下面的脚本可以工作，但是单击将显示/隐藏两个容器中的所有匹配元素，如何保持单击只影响父容器中的元素？first" style="display: none;&quo
浏览 2提问于2017-01-16得票数 0
回答已采纳
4回答
由于某些原因，我的列表项不在我的UL元素中，这干扰了页面的流动，并且看起来不正确。我已经尝试了所有的位置元素，但都不起作用。我想知道是不是因为我设计了一个不同的div而不是UL元素？请参阅示例谢谢
浏览 1提问于2012-03-10得票数 0
回答已采纳
下面是我在Django应用程序中使用的html： <div id="mahal_questions" class="showHide_div">
{{soldier.mahal_status.label_tag> 我这里有两个div，每个div包含3个字段。但是，由于某些原因，当我循环遍历div和在每个div中循环遍历</
浏览 23提问于2020-01-09得票数 0
回答已采纳
3回答
我试图弄清楚如何一次循环遍历每个列表元素，并在它们运行时向它们应用一个函数，我已经尝试了几种方法，一些提示会有帮助！HTML结构 <ul>
<li id="first-slide" class="slide active"><h1>Test</h1><&#
浏览 1提问于2015-01-14得票数 3
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
