首页 > web前端 > html教程 > jquery的DOM与事件

jquery的DOM与事件

php中世界最好的语言
发布: 2018-03-08 14:37:15
原创
1777 人浏览过

这次给大家带来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]的方法  
如:

var $v = $("#v") ;    //jQuery对象  
var v = $v[0]; //DOM对象 
登录后复制

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

var $v = $("#v"); //jQuery对象  
var v = $v.get(0); //DOM对象 
登录后复制

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

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)设置文本内容

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

$(‘selector’).val()获取表单内容
$(‘selector’).val(val)设置表单内容
$(‘selector’).attr(attributeName)获取元素属性
$(‘selector’).attr(attributeName,value)设置元素属性
$(‘selector’).removeAttr(attributeName)移除属性
登录后复制

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

相关阅读:

怎样让浏览器变成编辑器

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

以上是jquery的DOM与事件的详细内容。更多信息请关注PHP中文网其他相关文章!

相关标签:
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板