如何按类查找dom下的下一个div
在前端开发中，要按类查找DOM下的下一个div，可以使用以下方法：
- 使用JavaScript的querySelector方法：
- 使用JavaScript的querySelector方法：
- 这里假设当前div的类名为"currentDiv"，使用querySelector方法选择该div，然后使用nextElementSibling属性获取下一个兄弟元素div。
- 使用jQuery库：
- 使用jQuery库：
- 这里同样假设当前div的类名为"currentDiv"，使用jQuery选择器选择该div，然后使用next方法获取下一个兄弟元素div。
- 使用CSS选择器：
- 使用CSS选择器：
- 这里同样假设当前div的类名为"currentDiv"，使用querySelector方法选择该div，然后使用nextElementSibling属性获取下一个兄弟元素，再通过matches方法判断是否为div元素，如果不是则继续查找下一个兄弟元素，直到找到下一个div元素。
以上是按类查找DOM下的下一个div的几种常见方法。根据具体情况选择适合的方法来实现需求。
相关·内容
1回答
如果一个网站使用了react，我怎样才能按类抓取元素？
例如，这里有一个div：
<div class="Blockreact__Block-sc-1xf18x6-0 Flexreact__Flex-sc-1twd32i-0 IgxsY jYqxGr"></div>
如果网站再次构建，我如何每次都使用javascript获取这个div？如果我纠正了，在每次构建之后，react类总是不同的，还是始终保持不变？
浏览 9提问于2022-04-04得票数 0
回答已采纳
2回答
我很难弄清楚如何读取多个标记名称相同的子标记(如div)，以及何时按属性读取它。
所以我的html代码片段看起来像这样：
<div>....</div>
<div>....</div>
<div class = 'iwantthisone'>
<h4>value</h4>
<div class ='ilikethistoo'>
<span>another value</span>
</div>
浏览 1提问于2014-05-16得票数 0
我想悬停一个图像，并弹出一个div，没有插件。只需基本的jquery，jQuery就是这样的：
<script type="text/javascript">
$(document).ready(function() {
$(".wrapperfortooltip div img").hover(
function() {
$(this).css('border', 'solid 1px #E90E65');
$("div", th
浏览 0提问于2010-05-11得票数 2
回答已采纳
3回答
我正试图在我的博客评论中添加“向上投票”按钮。我把每一条评论都循环起来如下：
.row
for comment in Comments
.row
p #{comment}
.votecell(style='width:30px;float:left;margin-left: 15px;')
.voteUp(id='#{comment.id}', style='margin-bottom: -17px;') ▲
浏览 3提问于2014-11-13得票数 0
回答已采纳
在DOMDocument类中，有按id和按标记名(getElementById & getElementsByTagName)获取元素的方法，但不能按类获取元素。有没有办法做到这一点？
例如，我如何从下面的标记中选择div？
<html>
...
<body>
...
<div class="foo">
...
</div>
...
</body>
</html>
浏览 0提问于2011-02-26得票数 5
我有个问题。我有这个html。在阅读框中，有很多内容。和我有更多。阅读更多-打开链接和阅读更多的框在网页上。
<p>
<a href="http://staging.triple-b-it.nl/requirements-management/" title="Lees verder" class="readmore-open">Lees verder</a>
</p>
<div class="readmore-box">
</div>
现在是我的问题。单
浏览 4提问于2014-03-10得票数 0
回答已采纳
1回答
循环中不显眼的切换
、、、
我在一个包含许多记录(订单)的视图中使用了不显眼的切换。我让它在单独的div上工作，但现在我想让它工作，这样每个订单都可以在循环中使用自己的切换链接单独展开/收缩(该链接也是循环的)。
当我的可扩展div被称为x时，问题是切换按钮的每个循环都只是切换第一个div，而不是在它自己的迭代中切换div -我想最好的方法是使用order_id作为每个可扩展部分的标识符？
更有经验的观众可能会嘲笑这一点:)，但我尝试尝试代码，如：
<% for order in @orders do %>
# toggle
<a class="toggle" href="#&
浏览 2提问于2010-06-04得票数 0
回答已采纳
1回答
我有一个django项目，我实现了一个jquery函数来切换链接，但它不起作用。该链接不显示我希望它在切换时显示的隐藏内容。我的代码写在下面。
<a href="#" class="comment-reply-btn">REP</a>
<div class="comment-reply" style="display: None;">
{% for child_comment in comment.children%}
{{ child_comment.ti
浏览 0提问于2017-09-12得票数 1
5回答
如何才能按类找到下一个元素。
我尝试使用$(obj).next('.class');，但它只返回$(obj)父函数中的类。我需要通过类名将下一个元素带到代码中的任何位置。因为我的代码看起来像
<table>
<tr><td><div class="class">First</div></td></tr>
<tr><td><div class="class">Second</div></td></tr
浏览 4提问于2010-09-09得票数 114
回答已采纳
我有一个html容器结构，如
<div class='APart'>
<div class='Main'>
<input name='MainInput' value='1'>
</div>
<div class='Sub'>
<input name='SubInput' value='2'>
<input name='SubInput' value='5'
浏览 0提问于2018-11-09得票数 1
回答已采纳
我这里有个问题。如果我这里有html文件。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name
浏览 1提问于2014-06-27得票数 0
回答已采纳
我试图通过单击已附加的锚来显示附加的div中的一些数据。
<body>
<div class="container">
<br><append></append><br>
<button class="btn btn-primary" style="margin-top: 15">add</button>
</div>
</body>
jQuery
$('button').on('click
浏览 1提问于2019-01-23得票数 1
回答已采纳
3回答
我有一个包含许多div的页面，我需要在这个页面上实现一些JavaScript函数。有没有办法告诉浏览器按id对所有div进行排序，这样我就可以快速找到元素。我通常不知道浏览器是如何处理元素搜索的，在主流浏览器firefox、chrome上有没有排序？如何对元素进行索引？
浏览 1提问于2011-09-21得票数 0
回答已采纳
1回答
切换到for循环
、、、、
我想问一下关于多个切换到for循环的问题。例如，当我单击一个div时，会出现一个切换菜单。
这是我的密码：
for (var i = 0; i < myObjectString.length; i++) {
var obj = JSON.parse(myObjectString);
document.getElementById("endorsment").innerHTML += "<div id='endor'>\n\
<div class='endo_"+ obj.Endorsment[i]
浏览 1提问于2014-08-14得票数 0
回答已采纳
3回答
如何在div标签中结合使用this和类名，
$(this).$('.reason_1').show();
浏览 1提问于2013-07-24得票数 0
回答已采纳
5回答
我正在尝试从列表中获取具有某个类的元素。
我大致有下面的html
<ul id="list">
<li class="1">
<div class="container">
<div class="left">
<a href="">
<div class="text">
<p>Some tex
浏览 0提问于2011-10-19得票数 1
回答已采纳
当没有属性值时，为什么jQuery不删除类或样式的属性名？
例如，$('<div>').addClass('foo').removeClass('foo')返回[<div class></div>]而不是[<div></div>]
我的猜测是性能，但也许还有其他原因。
下面是jQuery的实现：
浏览 0提问于2012-12-14得票数 0
回答已采纳
5回答
我在页面上重复了一张图片，图片旁边有一个div，如下所示：
<img src="/img/productspage/questionMark.jpg" class="prodQuestionMark" />
<div class="vuQuestionBubble">
<p>this is where text for the text will go</p>
</div>
默认情况下，vuQuestion
浏览 0提问于2011-03-07得票数 4
回答已采纳
它是有效的：
<div class="xpav">
Create
</div>
<div class="apr" style="display: none;">
sometext
</div>
<script>
$('.xpav').click(function() {
$(this).next(".apr").slideDown("fast");
})
</script>
它不会：
<d
浏览 0提问于2011-04-19得票数 0
回答已采纳
3回答
我有一个jQuery代码：
$(document).ready(function () {
$("#hide").click(function () {
$("div1").hide();
});
$("#show").click(function () {
$("div1").show();
});
});
和这个jsp/html
for{int=0;i<V_loopnumber;i++)
{
%>
<button id='show&#
浏览 5提问于2013-12-10得票数 0
回答已采纳
4回答
我有一个比较表，其中有大约20个项目。我想当一个链接被点击时，它将显示更多关于该项目的信息。我可以使用以下函数来完成此操作：
$(function(){
$('.show').click(function() {
$('#keywords').fadeIn('slow');
});
});
但是，正如我所提到的，有20个项目，重复上面的代码可能会变得很麻烦。
如何创建一个在所单击的链接下面显示div的函数？最重要的是，如果某个div是打开的或可查看的，并且单击了另一项，我希望另一项关闭或淡出，然后显示另一项。
下面是我的HTML页面
浏览 1提问于2012-10-18得票数 0
回答已采纳
我在网上发现了一些示例，它们显示了如何使用某个类来计数元素。
document.querySelectorAll('#main-div .specific-class').length;
然而，我的问题是，我的班级有空格。例如
class="toggle btn btn-default off"
我该怎么数这些？
浏览 2提问于2020-04-21得票数 0
回答已采纳
我正在运行类似这样的东西来选择DOM中的所有div元素(这对我来说很好)：
var $mySelection=$("#wrapper").find('div').not("#main-content, #etc")
如何选择DOM中某个div之后的所有div元素呢？
浏览 1提问于2010-11-19得票数 3
回答已采纳
2回答
我有一个页面，其中有一个搜索表单和结果加载的表格。我正在尝试使用jQuery来定位一个表的下一个实例，但是由于某种原因我找不到它。
<div class="search">
<form class="search" method="get" action="/page.php">
<input id="search" type="text" value="" name="search">
<input ty
浏览 1提问于2015-01-16得票数 2
1回答
阅读更多展开文本
、、、
当用户点击“阅读更多”，而bio展开时，他们可以点击“显示更少”来显示部分bio。我想可能是一些javascript来显示或隐藏html的不同部分。我撕毁了html和Javascript的一部分，我认为它创造了这个效果，并将其放入code.pen.io中，但它没有起作用。我做错什么了？
我的代码笔尝试：
<li>
<div class="excerpt RTETextWrapper">
<div>
<p>Pat is a conscientious developer, a ma
浏览 1提问于2016-08-24得票数 0
回答已采纳
3回答
<script type="text/javascript">
$(document).ready(function(){
$('.show').click(function(e){
$(this).closest('.b').css('display','block');
e.preventDefault;
});
});
</script>
<style type="text/css">
.b{ display
浏览 2提问于2013-07-22得票数 0
回答已采纳
3回答
可能重复：
我在侧bxsilder中使用jquery。
我需要jquery来识别一个链接上的类更改，这个链接将沿着一条线动画一个图像。
在页面加载中，div1 .寻呼机-active将图像沿行向左移动:当下一次按下时，div2下的链接将得到..pager active类，依此类推。
因此，我需要jquery来认识到，div2现在有了..pager active类，用于向左动画img :50%
下面是我一直在使用的代码，用于div1的初始加载，但在加载后不会检测到任何类更改。
if( $('#div1 .pager-active').length){
$('
浏览 1提问于2012-05-24得票数 1
我在div中有一个div。在页面加载时，它们都应该是隐藏的，然后当我触发外部div上的slideDown()函数时，我希望内部div保持隐藏。我如何才能做到这一点？
<script>
$(function(){
$('.body').hide();
$('.display').click(function(){
$(this).closest('.wrapper').find('.body').slideDown();
});
});
</script>
<d
浏览 0提问于2011-09-28得票数 0
回答已采纳
如何使用jquery获取同一类的下一个位置，
我正在尝试此代码，但它在下次单击时不起作用
var directiveScrollTop= $(".site_section").next().position().top;
浏览 0提问于2012-10-25得票数 0
我有两个div，如下所示：
<div id="container1"><input class="1"><input class="2"></div>
<div id="container2"><input class="1"><input class="1"><input class="2"></div>
现在如何从container2中删除所有的class=“%1”。
浏览 0提问于2011-07-09得票数 4
回答已采纳
我想用javascript隐藏那些没有I的div。例如，在sharepoint中，.ms-globalbreadcrumb没有id。
frame = document.getElementById('frame1');
frame.contentWindow.document.getElementById('ctl00_PlaceHolderGlobalNavigation_PlaceHolderGlobalNavigationSiteMap_GlobalNavigationSiteMap').style.display='none';
上面
浏览 0提问于2011-05-19得票数 0
我现在有一个函数，它返回html div元素。我想在div元素中添加一个Extjs按钮。下面的代码如下所示，但是即使我使用renderTo，Extjs按钮也不会在div元素中呈现。对此有什么建议吗？
_getEmptyPageText:function(){
emptyCreateText = some text;
return '<div class="some class">' +
'<div class="some div">' + emptyCreateText +
浏览 5提问于2021-11-23得票数 0
回答已采纳
我有一个闪烁的精灵css动画为一个空的div。
#flashIt{
width: 50%;
height: 100px;
background: blue;
margin: 10px auto;
border: solid 2px black;
left: 25%;
animation: flash 1s linear infinite;
}
@keyframes flash {
0% { opacity: 1; }
50% { opacity: .1 }
100% { opacity: 1; }
}
所以这个动画是按原样工作的。但是，我希望当用户按下键
浏览 0提问于2018-03-19得票数 0
如何按类名获取Div的ExtJs组件对象？
说我的迪夫是：
<div class="abc"></div>
如何使该分区的ExtJs对象执行例如getWidth()
注意:没有给出id。
我尝试了什么：
Ext.select(".abc")
Ext.query(".abc")
编辑：
错误：Object has no method 'getWidth'
<div id="main">
<div class="abc"></div>
&l
浏览 0提问于2012-11-14得票数 8
回答已采纳
3回答
我继承了下面这段PHP代码，它在将内容推送到页面之前从DOM中删除元素。我们只想显示前5个元素，以避免页面太长
假设代码检索到如下结构的HTML片段：
<div class='year'>2019</div>
<div class='record'>Record A</div>
<div class='record'>Record B</div>
<div class='year'>2018</div>
<div class=&#
浏览 28提问于2019-07-10得票数 0
默认情况下，所有.setupData都是隐藏的。
当我单击一个.setupTitle类时，我希望它的直接(在DOM中的下一个) .setupData切换。
我试过了
$(".setupTitle").click(function(){
$(this).parent(".setupBlock").next(".setupData").slideToggle();
});
但没有骰子。
<div class="setupBlock">
<div class="setupTitle"&g
浏览 2提问于2015-01-09得票数 0
回答已采纳
2回答
下面是我正在编写的代码，我的目标是，每当用户点击带有"click_me“类的链接时，我想提醒它的父母兄弟的内容，即"Hello Friends”或"How are you?“。
我试着做下面的代码，但它不起作用。
$('.click_me').click(function(event){
alert($(this).parent('div').closest('p').html());
});
<li>
<div>
浏览 0提问于2013-10-06得票数 0
当enter被按在文本框中时，我试图从屏幕的左边滑动一个div。在这种情况发生后，另一个div需要从右边滑入(不需要任何额外的输入)。
这就是我到目前为止所拥有的。
联署材料：
$(':text').bind("enterKey", function(e) {
$(this).parent().parent().hide('slide', {
direction : "left"
}, 1000);
$(this).parent().parent().next().delay(750).sh
浏览 0提问于2013-09-25得票数 0
回答已采纳
<div class="a">
<div class="b">
<div class="c"></div>
<div class="c"></div>
<div class="c"></div>
</div>
<div class="b">
<div class="c"></div>
<
浏览 0提问于2019-10-25得票数 3
2回答
我有一组观众，它们的复选框隐藏在它的观众组下面。现在，我想在单击访问组名称时显示这些隐藏的复选框。
您可以在这里查看更多的im代码：
我有以下示例html代码：
<div class='audience-group'>
<input type='checkbox' class='audience-group-checkbox' value='9' />
<div class='audience-group-name'>
JGG Enterprise
浏览 1提问于2011-12-07得票数 0
回答已采纳
我有一个带有HTML的字符串。在HTML中有一个锚(<a>标记)列表，我想得到最后一个锚。
<div id="breadcrumbs">
<a href="/">Home</a>
<a href="/suppliers">Suppliers</a>
<a href="/suppliers/jewellers">This One i needed</a>
<span class="curr
浏览 5提问于2014-01-04得票数 0
回答已采纳
我有一个jquery函数，它将集中在下一个文本框上，同时按下'enter‘键，其中的name属性中有方括号。
我能够使它集中到同一个div中的下一个输入，例如a[]到b[]，b[]到c[]，但是我不能使它在c[]的下一个div中聚焦到a[]。
任何帮助都将不胜感激。
HTML：
<div class="row" style="padding-bottom: 3px">
<div class="col-xs-1" style="padding-right: 2px; padding-left: 0px
浏览 3提问于2015-05-01得票数 0
回答已采纳
当我点击DIV时，我需要按TAB键(以便从一个输入字段转到下一个)。
我试过这段代码，但不起作用：
$("#change_logo").click(function() {
e = jQuery.Event("keydown");
e.which = 9;
// This is the ID of the input where I want to simulate the "Press TAB Key"
// and then I will go automatically to the following inpu
浏览 5提问于2010-08-08得票数 0
回答已采纳
我的网站链接：
我有以下CSS，如果我按名称进行搜索，而不是按专业搜索的话：
.displayresult {
display: block;
}
#fname, #lname, #splabel, #addlabel, #pnlabel {
border-width: 4px;
border-bottom-style: double;
}
#first, #last, #specialty, #address, #phone {
border-width: 4px;
border-bottom-style: double;
}
如果用户选择专业并选择一
浏览 5提问于2013-05-07得票数 0
回答已采纳
1回答
反应功能与“这”
、、
我知道这里的“这个”绑定和其他东西，除了一件事。我不明白为什么“这个”在第一次调用中不是没有定义的，而是第二次？
我知道函数引用，在第一种情况下，它是执行函数，而在第二种情况下，是返回引用。
import React from "react";
import ReactDOM from "react-dom";
import "./styles.css";
class App extends React.Component {
constructor() {
super();
this.name = "MyComp
浏览 0提问于2018-11-11得票数 0
回答已采纳
我已经实现了一个数据抓取脚本，它使用CURL获取数据。
但是获取只记录一个页面，但我需要所有数据，因为在该页面上有分页。
我们正在使用以下方法获取数据
$xpath = new DOMXPath($dom);
$xpath_resultset = $xpath->query("//div[@class='parentListing']");
在上面的代码中，parentListing是div类，我在div和grep之间获取记录，使用不同的不同类。
谁能知道如何获得所有页面的分页数据。
如果任何人有任何建议，请帮助我。
谢谢..。
浏览 1提问于2014-04-18得票数 0
我是jQuery的新手，所以我可能会以错误的方式对待这个问题，但希望这里的人能帮助我。
我有一个非常大的HTML表，它是动态创建的。为了帮助用户，我想将导航事件绑定到这个表的箭头键。在本例中，我希望“跳转”从on到下一个div (它们也有"myClass"类)。表比下面的示例大，但是结构总是重复的，所以每三分之一的td都有一个(可编辑的) div。
到目前为止，我无法让它工作，但该函数确实捕捉箭头按下，因为我可以这样显示警报。
My jQuery:
$(document).on('keydown', '#tblCalendar', functio
浏览 0提问于2015-06-03得票数 0
回答已采纳
在HTML中，我有许多fieldset元素。
每当收音机/复选框/选择输入发生变化时，我都想看看是否有一个名为“结束符”的自定义HTML5属性。如果该属性存在并具有一个值==“是”，则我希望隐藏当前fieldset后面的所有fieldset。
这是我的HTML代码“如果需要”
<div class="panel panel-default " id="question_8">
<div class="panel-heading">1:b) What is the closest store to you home?
浏览 1提问于2015-12-03得票数 0
回答已采纳
5回答
<div class="begin">...</div>
如何匹配<div class="begin">中的html (包括)？
我需要一个regex解决方案，它可以处理嵌套的case。
浏览 8提问于2010-01-07得票数 0
1回答
检查返回作为对象
、、
我使用'createDivs‘类在PHP页面中列出了17个块。我试图在每次按下键盘的enter按钮搜索HTML源中的元素时，获取每个块上的文本数据，以查看它是否具有名为'blocksList div_1_1‘、'blocksList div_2_1’的类或它与整数对应的类，因此我可以用每个块上显示的文本显示警告消息。
var current_col = 1;
var current_row = 1;
var totalrowcount = 17; //is using for how many blocks of rows I have in total
$(do
浏览 4提问于2013-09-30得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM活动推荐
腾讯云开发者
