根据attr(attribute)获取属性名,必须知道上一级的div的class名或者id名,
或者本身知道div的class或者id要获取其他属性,都是这么做的。$("#d1")attr("xxx");xxx是你想获取的某个属性的值。
完整如下:
<div id="div1"><div class="c1" id="d1"></div></div>
$("#div1")find("div")attr("id")
$("#div1")find("div")attr("class")
一、选取DOM元素
jQuery的核心是通过各种选择器,选中DOM元素,可以用querySelectorAll方法模拟这个功能。
var $ = documentquerySelectorAllbind(document);
这里需要注意的是,querySelectorAll方法返回的是NodeList对象,它很像数组(有数字索引和length属性),但不是数组,不能使用pop、push等数组特有方法。
二、DOM *** 作
DOM本身就具有很丰富的 *** 作方法,可以取代jQuery提供的 *** 作方法。
尾部追加DOM元素。
// jQuery写法
$(parent)append($(child));
// DOM写法
parentappendChild(child)
头部插入DOM元素。
// jQuery写法
$(parent)prepend($(child));
// DOM写法
parentinsertBefore(child, parentchildNodes[0])
删除DOM元素。
// jQuery写法
$(child)remove()
// DOM写法
childparentNoderemoveChild(child)
一般而言,JQuery可以利用attr来获取元素的属性值,
1、$("元素")attr("属性"); //获取指定属性的值
2、$("元素")attr("属性","属性值");//设置属性值
3、$("元素")removeAttr("属性"); //移除指定属性
不过在16中加入了prop,用法同attr相同。只是将上面中attr替换成prop即可,不过在获取checked等属性时,将会返回标准属性true/false,不会和之前的attr一样,返回checked或者“”。
而JQuery中获取类名的属性为class亦可以为className,因为在HTML DOM中没有class属性,而是className属性。在JQuery中,有对className作出关键字的转换。
扩展资料:
jQuery是一个快速、简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架)。jQuery设计的宗旨是“write Less,Do More”,即倡导写更少的代码,做更多的事情。它封装JavaScript常用的功能代码,提供一种简便的JavaScript设计模式,优化HTML文档 *** 作、事件处理、动画设计和Ajax交互。
参考资料:
jQuery 的 index() 方法返回指定元素相对于其他指定元素的索引值,注意:索引值是从0开始计数的。获得当前元素的索引值可用click事件触发
示例代码如下:获取被点击的a标签的索引值
1,创建Html元素
2,设置css样式
3,编写jquery代码
4,观察效果:因为index从0开始计数,所以点击第三个元素,获取的索引值是2
扩展资料
jQuery的核心特性:
1,具有独特的链式语法和短小清晰的多功能接口;
2,具有高效灵活的css选择器,并且可对CSS选择器进行扩展;
3,拥有便捷的插件扩展机制和丰富的插件。
4,jQuery兼容各种主流浏览器,如IE 60+、FF 15+、Safari 20+、Opera 90+等。
参考资料:
1、打开html开发工具,新建一个html代码页面。
2、在html页面创建三个p标签,给这三个p标签设置不同的内容。
3、引入jquery库。在title标签后面引用下载好的jqueryjs文件。
4、 在jquery引用库标签后面新建一个script标签,在这个标签里面添加一个DOM加载完成后执行函数。
5、在DOM加载完成后执行函数里面添加点击p标签时获取当前元素的上一个元素对象。
6、保存html代码后使用浏览器打开,点击p标签d出框就会显示当前点击标签的上一个标签的内容。
以上就是关于如何用Jquery获取某一个Div的Class或者ID全部的内容,包括:如何用Jquery获取某一个Div的Class或者ID、jquery中如何选择选取DOM元素、jquery获取当前元素的classname等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)