前端开发jQuery常用方法

前端开发jquery常用方法|前端开发者

1,ajax请求javascript 代码

2, 如何获取checkbox,并判断是否选中
html 代码

3, 获取checkbox选中的值
html 代码

4,checkbox全选/反选/选择奇数
html 代码

5,获取select下拉框的值
html 代码

6,获取选中值,三种方法都可以:
html 代码

7,设置第一个Radio为选中值:
html 代码

或者
html 代码

8,设置最后一个Radio为选中值:
html 代码

或者
html 代码

9,根据索引值设置任意一个radio为选中值:
html 代码

或者
html 代码

1,关于页面元素的引用
通过jquery的$()引用元素包括通过id、class、元素名以及元素的层级关系及dom或者xpath条件等方法,且返回的对象为jquery对象(集合对象),不能直接调用dom定义的方法。

2、jquery对象与dom对象的转换
只有jquery对象才能使用jquery定义的方法。注意dom对象和jquery对象是有区别的,调用方法时要注意操作的是dom对象还是jquery对象。

普通的dom对象一般可以通过$()转换成jquery对象。
html 代码

则为jquery对象,可以使用jquery的方法。

由于jquery对象本身是一个集合。所以如果jquery对象要转换为dom对象则必须取出其中的某一项,一般可通过索引取出。
如:
html 代码

这些都是dom对象,可以使用dom中的方法,但不能再使用Jquery的方法。

以下几种写法都是正确的:
html 代码

3、如何获取jQuery集合的某一项
对于获取的元素集合,获取其中的某一项(通过索引指定)可以使用eq或get(n)方法或者索引号获取,要注意,eq返回的是jquery对象,而get(n)和索引返回的是dom元素对象。对于jquery对象只能使用jquery的方法,而dom对象只能使用dom的方法,如要获取第三个<div>元素的内容。有如下两种方法:
html 代码

4、同一函数实现set和get
html 代码

同样blur,focus,select,submit事件都可以有着两种调用方法

5、集合处理功能
对于jquery返回的集合内容无需我们自己循环遍历并对每个对象分别做处理,jquery已经为我们提供的很方便的方法进行集合的处理。
html 代码

6、扩展我们需要的功能
html 代码

使用扩展的方法(通过“$.方法名”调用):
html 代码

7、支持方法的连写
所谓连写,即可以对一个jquery对象连续调用各种不同的方法。
html 代码

8、操作元素的样式
html 代码

9、完善的事件处理功能
Jquery已经为我们提供了各种事件处理方法,我们无需在html元素上直接写事件,而可以直接为通过jquery获取的对象添加事件。
html 代码

jQuery中几个自定义的事件:

(1)hover(fn1,fn2):一个模仿悬停事件(鼠标移动到一个对象上面及移出这个对象)的方法。当鼠标移动到一个匹配的元素上面时,会触发指定的第一个函数。当鼠标移出这个元素时,会触发指定的第二个函数。

//当鼠标放在表格的某行上时将class置为over,离开时置为out。
html 代码

(2)ready(fn):当DOM载入就绪可以查询及操纵时绑定一个要执行的函数。

$(document).ready(function(){alert(“Load Success”)})http://www.idaima.com/a/1663.html

//页面加载完毕提示“Load Success”,不同于onload事件,onload需要页面内容加载完毕(图片等),而ready只要页面html代码下载完毕即触发。与$(fn)等价

(3)toggle(evenFn,oddFn): 每次点击时切换要调用的函数。如果点击了一个匹配的元素,则触发指定的第一个函数,当再次点击同一元素时,则触发指定的第二个函数。随后的每次点击都重复对这两个函数的轮番调用。 html 代码

(4)trigger(eventtype): 在每一个匹配的元素上触发某类事件。

例如:

$(“p”).trigger(“click”); //触发所有p元素的click事件

(5)bind(eventtype,fn),unbind(eventtype): 事件的绑定与反绑定

从每一个匹配的元素中(添加)删除绑定的事件。

例如:

$(“p”).bind(“click”, function(){alert($(this).text());}); //为每个p元素添加单击事件

$(“p”).unbind(); //删除所有p元素上的所有事件

$(“p”).unbind(“click”) //删除所有p元素上的单击事件

前端开发jquery常用方法|前端开发者

https://www.rokub.com

» 本文来自:前端开发者 » 《前端开发jQuery常用方法》
» 本文链接地址:https://www.rokub.com/2805.html
» 您也可以订阅本站:https://www.rokub.com
赞(0)
64K

评论 抢沙发

评论前必须登录!