Jquery先获取自身内部的元素属性值,该如何获取

Jquery先获取自身内部的元素属性值,该如何获取,第1张

jQuery手册中这样写道:

$(expression, [context])

expression String 用来查找的字符串

context (可选) Element, jQuery 作为待查找的 DOM 元素集、文档或 jQuery 对象。

那么,你可以这样获取:

$('img:first-child', this)attr('src');

--------------------------------------

或者用原生js:

var a = documentgetElementById('my')getElementsByTagName('a');

var src = [];

for(var i=0;i<slength;i++){

srcpush(a[i]getElementsByTagName('img')[0]src);

}

如果你知道div的class : $("classname")attr("id") 获得id

如果你知道div的id :$("#id")attr("class")获得class

如果都不知道,就要循环所有的div自己去判断了

var divs=$(div);

for(var i=0;i<divslength;i++)

{

//你的判断

}

获得div有什么属性 比如 data-id="a"

$("div[data-id='a']")attr("id")//获得id

$("div[data-id='a']")attr("class")//获得class

首先我要问一下你的jquery版本是多少?如果是jquery18以后的话,jquery的attr方法已经用prop方法替代了,prop方法的用法和attr完全一样,jquery18以后的attr方法会出现你说的问题。你把attr改成prop试一下

jQuery获取方法

data()方法

//HTML代码 <div id="myDiv" data-appid="123" data-myname="lsxj" data-app-id="456" data-my-name="secondname"></div>

//获取属性

var appid = $("#myDiv")data("appid"); //123

var app-id = $("#myDiv")data("app-id"); //456

//属性赋值 $("#myDiv")data("appid","666");

//最终HTML代码 <div id="myDiv" data-appid="123" data-myname="lsxj" data-app-id="456" data-my-name="secondname"></div>

需要注意的是,data()的值进行修改并不会影响到DOM元素上的data-属性的改变。data()的本质其实是将一个 “cache” 附加到了对象上,并使用了一个特殊的属性名称。

所以上述代码中,虽然对div进行了data()赋值 *** 作,但HTML代码中div的data-appid的值仍然为123,因为data()只是修改了缓存的那个值,此时进行$('#myDiv')data("appid")的 *** 作,输出的结果为666

js获取data-的方式

通过dataset属性访问

//HTML代码

<div id="myDiv" data-appid="123" data-myname="lsxj"></div>

//js代码

var div = documentgetElementById("myDiv");

var appId = divdatasetappid;//获取data-appid的值

var myName = divdatasetmyname;//获取data-myname的值

//设置值

divdatasetappid = 456;

divdatasetmyname = "newname";

//最终HTML结果

<div id="myDiv" data-appid="456" data-myname="newname"></div>

dataset属性的值是DOMStringMap的一个实例,名值对的映射。每个data-name形式的属性都有一个对应的属性,只不过该属性名没有data-前缀。

兼容性:

需要注意的是,dataset中大小写的问题。带连字符连接的名称在使用的时候需要命名驼峰化。例如data-my-name对应的是datasetmyName的值。可看以下代码

//将上面代码的设置值部分进行修改

divdatasetappId = 789;

divdatasetmyName = "secondname";

//最终结果

<div id="myDiv" data-appid="123" data-myname="lsxj" data-app-id="456" data-my-name="secondname"></div>

$(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>

不明白就追问

A、prop() 方法设置或返回被选元素的属性和值。

当该方法用于返回属性值时,则返回第一个匹配元素的值。

当该方法用于设置属性值时,则为匹配元素集合设置一个或多个属性/值对。

注意:prop() 方法应该用于检索属性值,例如 DOM 属性(如 selectedIndex, tagName, nodeName, nodeType, ownerDocument, defaultChecked, 和 defaultSelected)。

提示:如需检索 HTML 属性,请使用 attr() 方法代替。

提示:如需移除属性,请使用 removeProp() 方法。

B、val() 方法返回或设置被选元素的值。

元素的值是通过 value 属性设置的。该方法大多用于 input 元素。

如果该方法未设置参数,则返回被选元素的当前值。

C、removeAttr() 方法从被选元素中移除属性。

D、设置或返回匹配元素的样式属性

故,此题选择A

以上就是关于Jquery先获取自身内部的元素属性值,该如何获取全部的内容,包括:Jquery先获取自身内部的元素属性值,该如何获取、如何用Jquery获取某一个Div的Class或者ID、jq获取动态元素属性等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

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

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

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

发表评论

登录后才能评论

评论列表(0条)

保存