如何用Jquery获取某一个Div的Class或者ID

如何用Jquery获取某一个Div的Class或者ID,第1张

可以先定位到这个DIV,然后采用attr方法来获取其值:

假如说:有一段Html代码:

[html] view plaincopy

<div class="comment" id="22">

<div class="comment_detail" style="display: block; ">

<div class="comment_my"><textarea class="comment_text" style="height: 16px; "></textarea></div>

<div class="comment_text_bottom" style="display: none; ">

<div class="comment_emotion"><a href="javascript:void(0)" class="comment_emotion_button">表情</a>

<div class="comment_emotion_detail" style="display: none; ">

</div>

</div>

<div class="comment_publish"><input class="submit" type="submit" value="评论"></div>

</div>

</div>

<div class="comment_bar"><a href="javascript:void(0)" class="comment_click"></a></div>

</div>

如果想从submit处定位,获取到comment处DIv的ID,那么就可以这样做:

ID值为:

[javascript] view plaincopy

$("submit")parent()parent()parent()parent()attr('id');

其值为:22;

CLASS值为:

[javascript] view plaincopy

$("submit")parent()parent()parent()parent()attr('class')

其值为:comment;

思路:利用jQuery选择器直接根据类名获取对象→遍历对象→使用 attr() 方法获取id属性值。下面实例演示——获取所有class为test的元素的id值:

1、HTML结构

<div class="test" id="div_id">我的类是test,id是div_id</div>

<input type="text" class="test" id="input_id" value="我的类是test,id是input_id" />

<div class="test">我的类是test,没有id属性</div>

<li class="test" id="li_id">我的类是test,id是li_id</li>

<input type="button" value="确定">

2、jQuery代码

$(function(){

$("input[type='button']")click(function() {

var ids = [];

$("test")each(function(index, el) {

var id = $(this)attr("id");

if(typeof(id)!=='undefined'){

idspush(id)

}

});

alert(ids);

});

});

3、效果演示

$("div")index(this)text();改成$(this)text();即可。不过你的div宽度是100%,从下往上移4会挡住其他的,除非你把浏览器缩小,从左边移进去。 修改建议,加个id为tips的div,然后将index的值放进去,这样移动的时候它就会自动变换,看起来明显些。如下:\x0d\\x0d\asasas\x0d\2\x0d\3\x0d\4\x0d\\x0d\$(function(){\x0d\$("div")hover(function(){\x0d\ var index=$(this)text(); \x0d\ $("#tips")html(index);\x0d\ })\x0d\}) \x0d\回答于 2022-11-16

先获取当前对象,再根据对象去获取上一个兄弟节点和下一个兄弟节点

prev()

定义和用法

prev() 获得匹配元素集合中每个元素紧邻的前一个同胞元素,通过选择器进行筛选是可选的。

prev(selector)

参数描述

selector    字符串值,包含用于匹配元素的选择器表达式。  

--说明:如果给定一个表示 DOM 元素集合的 jQuery 对象,prev() 方法允许我们在 DOM 树中搜索这些元素的前一个同胞元素,并用匹配元素构造一个新的 jQuery 对象。

next()

定义和用法

next() 获得匹配元素集合中每个元素紧邻的同胞元素。如果提供选择器,则取回匹配该选择器的下一个同胞元素。

next(selector)

参数描述

selector    字符串值,包含用于匹配元素的选择器表达式。  

--说明:如果给定一个表示 DOM 元素集合的 jQuery 对象,next() 方法允许我们搜索 DOM 树中的元素紧跟的同胞元素,并用匹配元素构造新的 jQuery 对象。

示例:

<!--HTML代码-->

<div id="div1">111</div>

div id="div2">222</div>

div id="div3">333</div>$("#div2")prev()attr("id");    //获取div2同级的上一个div的id,值为div1

$("#div2")next()attr("id");    //获取div2同级的下一个div的id,值为div3

jq可以直接使用$("div")获得所有div,但是如果要具体到一个div的话,需要给div一个标记,然后通过html就可以获取值了。

1<div id="divId" class="divClass"> 内容 </div>

123/jq 代码 jq选择器/$("#divId")html();$("divClass")html();

第一步, 获取你要得到高度的那个div的jQuery对象, 获得方法有很多很多种, 具体你可以看一下jQuery API文档里的选择器部分, 在这里我只跟你说一个最直接的方法, 通过id获得: $("#div_id")

第二步, 要看你要得到的是什么高度了, jQuery里现有的三个(其实是两个)获得高度的方法是:

1 $("#div_id")height(); // 获得的是该div本身的高度, (不包含padding,margin,border)

2 $("#div_id")outerHeight(); // 包含该div本身的高度, padding上下的高度, 以及border上下的高度(不包含margin的高度)

3 $("#div_id")outerHeight(true); // 包含该div本身的高度, 以及padding,border,margin上下的总高度

以上就是关于如何用Jquery获取某一个Div的Class或者ID全部的内容,包括:如何用Jquery获取某一个Div的Class或者ID、jquery怎样在获取同一个div下的类的ID、jquery怎么获取DIV里面的值等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/web/10195318.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-05-06
下一篇2023-05-06

发表评论

登录后才能评论

评论列表(0条)

    保存