jquery的DOM与事件


本文摘自PHP中文网,作者php中世界最好的语言,侵删。

这次给大家带来jquery的DOM与事件,使用jquery的DOM与事件的注意事项有哪些,下面就是实战案例,一起来看一下。

说说库和框架的区别?
框架和类库最重要的区别是控制权的反转。框架就像一个模具,它需要你把原材料放在模具里面,然后成品就出来了,由于模具已经造好,所以原材料不能乱加,人家要什么你就给什么,控制权在模具。但是类库就不一样了,控制权在你手中,想实现什么功能就实现什么功能,类库只是帮你封装好了大量实用的函数,帮助你实现自己的目的,你要做的只是根据自己的需要合适地调用这些函数。

jquery 能做什么?
操作文档对象、选择DOM元素、制作动画效果、事件处理、使用Ajax以及其他功能。除此以外,jQuery提供API让开发者编写插件。其模块化的使用方式使开发者可以很轻松的开发出功能强大的静态或动态网页。

jquery 对象和 DOM 原生对象有什么区别?如何转化?
区别:
1、jquery选择器得到的jquery对象和标准的 javascript中的document.getElementById()取得的dom对象是两种不同的对象类型,两者不等价; 
2、jQuery无法使用DOM对象的任何方法,同理DOM对象也不能使用jQuery里的方法. 乱使用会报错。
如何转化:
jQuery对象转成DOM对象---两种转换方式:
1、jQuery对象是一个数据对象,通过[index]的方法  
如:

1

2

var $v = $("#v") ;    //jQuery对象  

var v = $v[0]; //DOM对象 

 
2、jQuery本身提供,通过.get(index)方法  
如:

1

2

var $v = $("#v"); //jQuery对象  

var v = $v.get(0); //DOM对象 

 
DOM对象转成jQuery对象:  
对于DOM对象,只需用$()把DOM对象包装起来,就可得到jQuery对象 
如:

1

2

var v=document.getElementById("v"); //DOM对象  

var $v=$(v); //jQuery对象

jquery中如何绑定事件?bind、unbind、delegate、live、on、off都有什么作用?推荐使用哪种?使用on绑定事件使用事件代理的写法?
通过jquery提供的api进行事件绑定。
bind:为一个元素绑定一个事件处理程序。
unbind:从元素上删除一个以前附加事件处理程序。
delegate: 向匹配元素的当前或未来的子元素附加一个或多个事件处理器。
live: 为当前或未来的匹配元素添加一个或多个事件处理器
on:在选定的元素上绑定一个或多个事件处理函数。
off:移除一个事件处理函数。
推荐使用on,off。
on的用法:.on( events [, selector ] [, data ], handler(eventObject) )

jquery 如何展示/隐藏元素?
使用show(),hide()来展示和隐藏元素。

jquery 动画如何使用?
通常情况下使用.animate()来进行自定义动画。

如何设置和获取元素内部 HTML 内容?如何设置和获取元素内部文本?
使用$(‘selector’).html()获取HTML内容,$(‘selector’).html(value)设置HTML内容使用
$(‘selector’).text()获取元素内部文本,$(‘selector’).text(value)设置文本内容

如何设置和获取表单用户输入或者选择的内容?如何设置和获取元素属性?

1

2

3

4

5

$(‘selector’).val()获取表单内容

$(‘selector’).val(val)设置表单内容

$(‘selector’).attr(attributeName)获取元素属性

$(‘selector’).attr(attributeName,value)设置元素属性

$(‘selector’).removeAttr(attributeName)移除属性

相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!

相关阅读:

怎样让浏览器变成编辑器

简单的冒泡以及双向冒泡排序案列

以上就是jquery的DOM与事件的详细内容,更多文章请关注木庄网络博客

相关阅读 >>

jQuery trim()函数怎么用

jQuery绑定事件有几种方式?

jQuery如何判断是否是ie浏览器

jQuery取值如何取整

jQuery如何判断是否是数组

jQuery中如何实现判断空串

jQuery中怎样实现两秒之后刷新页面

jQuery中deferred对象是什么?

jQuery中如何获取图片真实大小

jQuery children()和find()区别有哪些

更多相关阅读请进入《jQuery》频道 >>




JavaScript 从入门到项目实践
书籍

JavaScript 从入门到项目实践

清华大学出版社

本书采取“基础知识→核心应用→核心技术→高级应用→行业应用→项目实践”的结构和“由浅入深,由深到精”的学习模式进行讲解。全书共35章,不仅介绍了HTML、CSS、对象、函数、事件等JavaScript语言的基础知识,而且深入介绍了jQuery、客户端、服务器端、数据存储等核心技术。



打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...