jQuery中attr()与prop()区别介绍

news/2024/7/11 1:37:46 标签: js, jquery
.attr() : 获取匹配的元素集合中的第一个元素的属性的值 或 设置每一个匹配元素的一个或多个属性。 •.attr( attributeName ) •.attr( attributeName )
•.attr( attributeName, value ) •.attr( attributeName, value )
•.attr( attributes )
•.attr( attributeName, function(index, attr) )
 
.prop() : 获取匹配的元素集中第一个元素的属性(property)值或设置每一个匹配元素的一个或多个属性。 •.prop( propertyName ) •.prop( propertyName )
•.prop( propertyName, value ) •.prop( propertyName, value )
•.prop( properties )
•.prop( propertyName, function(index, oldPropertyValue) )
 
是参数有区别,attr()传入的是attributeName,而prop()传入的是propertyName,
 
Attributes vs. Properties
在这里,我们可以将attribute理解为“特性”,property理解为为“属性”从而来区分俩者的差异。
 
如果把DOM元素看成是一个普通的Object对象,这个对象在其定义时就具有一些属性(property),比如把select的option当做一个对象:
var option = {
selected:false,
disabled:false,
attributes:[],
...
}
现在,我们一目了然了,attribute是一个特性节点,每个DOM元素都有一个对应的attributes属性来存放所有的attribute节点,它是一个类数组的容器。attributes的每个数字索引以名值对(name=”value”)的形式存放了一个attribute节点。而property就是一个属性,是一个以名值对(name=”value”)的形式存放在Object中的属性。
 
jquery中attr和prop的区别介绍:
 •对于HTML元素本身就带有的固有属性,在处理时,使用prop方法。
•对于HTML元素我们自己自定义的DOM属性,在处理时,使用attr方法。

例如:
<a href="http://www.baidu.com" target="_self" class="btn">百度</a>
这个例子里<a>元素的DOM属性有“href、target和class",这些属性就是<a>元素本身就带有的属性,也是W3C标准里就包含有这几个属性,或者说在IDE里能够智能提示出的属性,这些就叫做固有属性。处理这些属性时,建议使用prop方法。
 
<a href="#" id="link1" action="delete">删除</a>
这个例子里<a>元素的DOM属性有“href、id和action”,很明显,前两个是固有属性,而后面一个“action”属性是我们自己自定义上去的,<a>元素本身是没有这个属性的。这种就是自定义的DOM属性。处理这些属性时,建议使用attr方法。

 


http://www.niftyadmin.cn/n/875372.html

相关文章

JS判断所有浏览器型号(包括谷歌和360)

//判断浏览器 function checkBrowser() {var ua navigator.userAgent.toLocaleLowerCase();var browserType null;if (ua.match(/msie/) ! null || ua.match(/trident/) ! null) {browserType "IE";browserVersion ua.match(/msie ([\d.])/) ! null ? ua.match(…

Webstorm配置YUI来压缩CSS和JS代码

在网上搜YUI的jar包&#xff0c;下载完放在webstorm的安装目录lib里。 打开webstorm的设置&#xff0c;找到Tool下面的Filewatchers 点右上角的绿色加号&#xff0c;点开之后翻到最底下找到这俩货逐一添加&#xff0c; 配置路径&#xff0c;就是放jar包的文件夹路径&#xff0c…

openlayers加载WMS服务图层

var tian_di_tu_road_layer new ol.layer.Tile({title: "天地图路网",source: new ol.source.XYZ({url: "http://t4.tianditu.com/DataServer?Tvec_w&x{x}&y{y}&l{z}&tk42dca576db031641be0524ee977ddd04"})});//加载天地图--注记图层va…

百度地图API加载点位

var map new BMap.Map("map");map.centerAndZoom(new BMap.Point(116.403694,39.916263), 19);//添加地图类型控件map.addControl(new BMap.MapTypeControl({mapTypes:[BMAP_NORMAL_MAP,BMAP_HYBRID_MAP]}));map.setCurrentCity("北京");map.enableScroll…

点击按钮获得当前点击一行表格数据中的某几列并组成新表格样式

需求大致如下&#xff1a; 每点击一次添加按钮&#xff0c;就添加当前表格中的“名称”、“时间”两列数据到下边的新表格&#xff0c;h5代码先贴上&#xff1a; <table id"tab"><thead><tr><th>名称</th><th>站点</th>&…

cesium.js加载geojson三维建筑

geojson数据就是普通的图层数据&#xff0c;只是文件里有建筑物高度这一属性。 引入文件如下&#xff1a;&#xff08;app7.js是自己的文件&#xff09; JS代码示例&#xff1a; 先去官网申请一个token加在代码前面 Cesium.Ion.defaultAccessToken "官网申请的token&q…

cesium实现给三维建筑物贴图

代码太多直接贴上来看吧……就是cesium.js并没有直接给三维建筑模型贴图的方法&#xff0c;但是有把图片变成三维模型的方法&#xff0c;利用这个方法&#xff0c;给图片设置长宽高&#xff0c;定义经纬度和图片旋转角度&#xff0c;做出一个图片贴在模型上的假效果&#xff0c…

cesium加载cesiumLab发布的三维建筑数据

刚开始用的是cesium加载geojson来达到加载三维建筑的目的&#xff0c;加载建筑物倒是没什么太大问题&#xff0c;只是建筑物还要进行贴图&#xff0c;如果再用geojson来加载贴图会特别卡&#xff0c;浏览器会崩溃&#xff0c;电脑会死机&#xff0c;于是发现官网有这种方法&…