Jquery属性获取——attr()与prop
今天在项目中使用下拉菜单时,使用juery操作,使页面加载完菜单默认选中的值为2,我一开始的操作如下:
咋一看好完美,木问题,但是我发现在Safari浏览器中,根本不起作用!!仔细查看一番发现,在Safari浏览器中,属性确实是设置成功了,既value=2的那一项确实是。那问题出在哪呢?冷静,不要方,万能的stack说只要把改成就行了,卧槽还真行了,这是啥诡异事件。好吧,我们需要来研究研究了,不用想,肯定是需要祭出官方文档了。
- attr : 获取匹配的元素集合中的第一个元素的属性的值 或 设置每一个匹配元素的一个或多个属性。
- .attr( attributeName )
- .attr( attributeName, value )
- .attr( attributeName, value )
- .attr( attributes )
- .attr( attributeName, function(index, attr) )
- prop : 获取匹配的元素集中第一个元素的属性(property)值或设置每一个匹配元素的一个或多个属性。
- .prop( propertyName )
- .prop( propertyName, value )
- .prop( propertyName, value )
- .prop( properties )
- .prop( propertyName, function(index, oldPropertyValue) )
看出区别了吗,没错,是参数有区别,传入的是,而传入的是,现在我们的问题转移了,我们需要研究的是和之间的区别了。
在这里,我们可以将attribute理解为“特性”,property理解为为“属性”从而来区分俩者的差异。 如果把DOM元素看成是一个普通的Object对象,这个对象在其定义时就具有一些属性(property),比如把select的option当做一个对象:
现在,我们一目了然了,attribute是一个特性节点,每个DOM元素都有一个对应的attributes属性来存放所有的attribute节点,它是一个类数组的容器。attributes的每个数字索引以名值对(name=”value”)的形式存放了一个attribute节点。而property就是一个属性,是一个以名值对(name=”value”)的形式存放在Object中的属性。
回到一开始的问题,根据W3C的表单规范 ,在selected属性(property)是一个布尔属性, 这意味着,如果这个特性(attribute)存在, 即使该特性没有对应的值,或者被设置为空字符串值,或甚至是\”false\”,相应的属性(property)都还是为true。 selected特性(attribute)值不会因为复选框的状态而改变,而selected属性(property)会因为复选框的状态而改变。因此,跨浏览器兼容的检索和更改DOM属性,比如元素的checked, selected, 或 disabled状态,请使用.prop方法。
之所以attribute和property容易混倄在一起的原因是,很多attribute节点还有一个相对应的property属性,比如DOM元素的id和class既是attribute,也有对应的property,不管使用哪种方法都可以访问和修改。
利用JQuery操作iframe父页面/子页面元素和方法汇总
前言
iframe在复合文档中经常用到,利用jquery操作iframe可以大幅提高效率,本文主要给大家分享了关于简单使用JQUERY来操作IFRAME的一些记录,这个使用纯JS也可以实现。下面话不多说了,来一起看看详细的介绍吧。
第一、在iframe中查找父页面元素的方法:
第二、在父页面中获取iframe中的元素方法:
第三、在iframe中调用父页面中定义的方法和变量:
JQUERY、JS调用IFRAME父窗口与子窗口元素的方法
1.jquery 在iframe子页面获取父页面元素代码如下:
2. jquery在父页面 获取iframe子页面的元素 代码如下:
3.js 在iframe子页面获取父页面元素代码如下:
4.js 在父页面获取iframe子页面元素代码如下:
5.子类iframe内调用父类函数:
jquery_iframe父子级页面事件使用
1、index.html
2、main.html
利用JQuery操作iframe父页面、子页面的元素和方法汇总
JavaScript学习笔记(三十二)—jQuery(中)
jQuery
- 昨天讲了 jQuery 的基本选择器筛选器和属性操作
- 今天来说一些 jQuery 别的东西
元素操作
- 创建一个元素
- 内部插入元素
- 外部插入元素
- 替换元素
- 删除元素
- 克隆元素
元素尺寸
- 操作元素的宽和高
- 获取元素的内置宽和高
- 获取元素的外置宽和高
元素位置
- 元素相对页面的位置
- 元素相对于父元素的偏移量
- 获取页面卷去的高度和宽度
元素事件
- 绑定事件的方法
- 移除事件
- 只能执行一次的事件
- 直接触发事件
可以直接使用的常见事件
- 可以直接使用的事件就是可以不利用 on 来绑定,直接就可以使用的事件方法
- click
- dblclick
- scroll
- hover
动画
- show
- hide
- toggle
- animate
- stop
- finish
本文作者及来源:Renderbus瑞云渲染农场https://www.renderbus.com
文章为作者独立观点不代本网立场,未经允许不得转载。