jquery怎样在获取同一个div下的类的ID

jquery怎样在获取同一个div下的类的ID,第1张

思路:利用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、效果演示

$("#id")获取这个对象,获取对象属性的话$("#id")attr("属性名")

jQuery是一个快速、简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架)。jQuery设计的宗旨是“write Less,Do More”,即倡导写更少的代码,做更多的事情。它封装JavaScript常用的功能代码,提供一种简便的JavaScript设计模式,优化HTML文档 *** 作、事件处理、动画设计和Ajax交互。

jQuery的核心特性可以总结为:具有独特的链式语法和短小清晰的多功能接口;具有高效灵活的css选择器,并且可对CSS选择器进行扩展;拥有便捷的插件扩展机制和丰富的插件。jQuery兼容各种主流浏览器,如IE 60+、FF 15+、Safari 20+、Opera 90+等。

2007年7月,jQuery 113版发布,这次小版本的变化包含了对jQuery选择符引擎执行速度的显著提升。从这个版本开始,jQuery的性能达到了Prototype、Mootools以及Dojo等同类JavaScript库的水平。同年9月,jQuery 12版发布,它去掉了对XPath选择符的支持,原因是相对于CSS语法它已经变得多余了。这一版能够对效果进行更为灵活的定制,而且借助新增的命名空间事件,也使插件开发变得更容易。同时,jQuery UI项目也开始启动,这个新的套件是作为曾经流行但已过时的Interface插件的替代项目而发布的。jQuery UI中包含大量预定义好的部件(widget),以及一组用于构建高级元素(例如可拖放、拖拽、排序)的工具。

2008年5月,jQuery 126版发布,这版主要是将Brandon Aaron开发的流行的Dimensions插件的功能移植到了核心库中,同时也修改了许多BUG,而且有不少的性能得到提高。因此,如果以前的jQuery版本升级到126,那么完全可以从代码中排除Dimensions插件(一个获得元素尺寸、定位的插件)。

在jQuery迅速发展的同时,一些大的厂商也看中了商机。2009年9月,微软和诺基亚公司正式宣布支持开源的jQuery库,另外,微软公司还宣称他们将把jQuery作为Visual Studio工具集的一部分。他将提供包括jQuery的智能提示、代码片段、示例文档编制等内容在内的功能。微软和诺基亚公司将长期成为jQuery的用户成员,其他成员还有Google,Intel,IBM,Intuit等公司。

2009年1月,jQuery 13版发布,它使用了全新的选择符引擎Sizzle,在各个浏览器下全面超越其他同类型JavaScript框架的查询速度,程序库的性能也因此有了极大提升。这一版本的第2个变化就是提供live()方法,使用live()方法可以为当前及将来增加的元素绑定事件,在13版之前,如果要为将来增加的元素绑定事件,需要使用livequery插件,而在13版中,可以直接用live()方法。

在开发过程中,jQueryhtml() 是获取当前节点下的html代码,并不包含当前节点本身的代码,然而我们有时候的确需要,可以通过jQueryprop("outerHTML")的方式设置。

很多jQuery的使用者都对这一问题深感疑惑。为什么在众多方便的各种获取属性和设置属性的方法中就不能像DOM中一样直接设置html元素的outerHTML呢?

因为原生JS DOM里有一个内置属性 outerHTML (看清大小写哦,JS是区分大小写的)用来获取当前节点的html代码(包含当前节点),所以用jQuery的prop()能拿到

一、jquery获取outerhtml

<div class="test"><p>hello,你好!</p></div>

<script>

$("test")prop("outerHTML");

</script>

二、jquery设置outerhtml

 $(

'test'

)prop(

'outerHTML'

'<input>'

);

$(function(){

l=$("div")length;

$("input")click(function(){

for(i=0;i<l;i++){

a=$("div")eq(i)css("z-index");

b=$("div")eq(i)attr("id");

if(a==100){

alert(b)

}

}

})

})<div id="div_1" class="c1" style="z-index:100; position:relative">1<input type="button" name="" value="点我" /></div>

<div id="div_2" class="c1" style="z-index:200; position:relative">2</div>

<div id="div_3" class="c1" style="z-index:300; position:relative">3</div>

<div class="c2"></div>

<div class="c3"></div>

不明白就追问

参考下面代码

<div id="a" class="sssss"></div>

var divid = $("#a")attr("id");

var divClass = #("#a")attr("class");

如果有多个DIV要获取:

var ids=[],arrClass=[];

$("div")each(function(){

idspush($(this)attr("id"));

arrClasspush(#(this)attr("class"));

});

alert("ids:"+idsjoin(","));

alert("class:"+arrClassjoin(","));

1、根据div标签获取所有的div节点

var divs = $('div');//获取所有的div节点

2、获取div的id

divseach(function(k,v){//通过each循环每个div节点

  alert(thisid);//获取div节点的id值

});

"1、利用标签名获取元素

$(""标签名"")

2、通过ID获取元素

$(""#id_name"")

3、通过 类名获取元素

$(""className"")

4、一次性获取多个元素

$(""元素名, 元素名, 元素名 "")

5、通过指定层次关系获取元素

$(""祖先 子孙"")

$(""父 > 子"")

$(""前 + 后"")

$(""兄 ~ 弟"")

6、根据元素的属性值获取元素

[attribute]

[attribute = value]

[attribute != value]

[attribute ^= value]

[attribute $= value]

[attribute = value]"

以上就是关于jquery怎样在获取同一个div下的类的ID全部的内容,包括:jquery怎样在获取同一个div下的类的ID、jquery怎么根据id获取元素值、怎样用jQuery自带方法/函数来获取outerHTML属性等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

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

原文地址: http://outofmemory.cn/web/9470705.html

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

发表评论

登录后才能评论

评论列表(0条)

保存