jQuery 能做什么?
Jquery是继prototype之后又一个优秀的Javascrīpt框架。它是轻量级的js库(压缩后只有21k) ,它兼容CSS3,还兼容各种浏览器 (IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+)。jQuery使用户能更方便地处理HTML documents、events、实现动画效果,并且方便地为网站提供AJAX交互。jQuery还有一个比较大的优势是,它的文档说明很全,而且各种应用也说得很详细,同时还有许多成熟的插件可供选择。jQuery能够使用户的html页保持代码和html内容分离,也就是说,不用再在html里面插入一堆js来调用命令了,只需定义id即可。
jQuery 对象和 DOM 原生对象有什么区别?如何转化?
- DOM对象拥有DOM对象的属性方法。
- jQuery对象:是DOM元升级对象经过包装之后,拥有jQuery的属性和方法(对原生DOM对象的封装);
- jQuery对象是一个数据对象,可以通过[index]的方法,来得到相应的DOM对象。
如:var $el =$("#element") ; //jQuery对象
var el=$el[0]; //DOM对象 - jQuery本身提供,通过.get(index)方法,得到相应的DOM对象
如:var $el=$("#element"); //jQuery对象
var el=$el.get(0); //DOM对象
-对于DOM对象,只需要用$()把DOM对象包装起来,就可以获得一个jQuery对象了
jQuery中如何绑定事件?bind、unbind、delegate、live、on、off都有什么作用?推荐使用哪种?使用on绑定事件使用事件代理的写法?
- 最简单的是bind(type,handle),这种方式的写法和type(handle)写法的作用是相同的($('a').click(function(){})),对应的取消事件的方法是unbind:如果不带参数默认移除所有的绑定事件,若带参数则移除指定的事件监听($(‘p’).unbind('click'))。bind这种是直接在符合条件的元素上绑定监听函数,因此没生成一个新的元素,就需要给新元素绑定一次事件
- bind(type,[data],fn) 为每个匹配元素的特定事件绑定事件处理函数。
- unbind(type,[data|fn]]) bind()的反向操作,从每一个匹配的元素中删除绑定的事件。
- delegate(selector,[type],[data],fn) 指定的元素(属于被选元素的子元素)添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数。
- live(type, [data], fn) jQuery 给所有匹配的元素附加一个事件处理函数,即使这个元素是以后再添加进来的也有效。
这个方法是基本是的 .bind() 方法的一个变体。使用 .bind() 时,选择器匹配的元素会附加一个事件处理函数,而以后再添加的元素则不会有。为此需要再使用一次 .bind() 才行 - on(events,[selector],[data],fn) 在选择元素上绑定一个或多个事件的事件处理函数。
- off(events,[selector],[fn]) 在选择元素上移除一个或多个事件的事件处理函数。
$("p").on("click", function(){
alert( $(this).text() );
});
jQuery 如何展示/隐藏元素?
$('div').hide([duration][,easing][,complete]);//隐藏
$('div').slideUp([duration][,easing][,complete]);//向上收起
$('div').fadeOut([duration][,easing][,complete]);//淡出
$('div').show([duration][,easing][,complete]);//隐藏
$('div').slideDown([duration][,easing][,complete]);//向下滑出
$('div').fadeIn([duration][,easing][,complete]);//淡入
#jQuery 动画如何使用?
- animate(params,[speed],[easing],[Callback]) 用于创建自定义动画的函数。这个函数的关键在于指定动画形式及结果样式属性对象。
- 必需的 params 参数定义形成动画的 CSS 属性。
可选的 speed 参数规定效果的时长。它可以取以下值:“slow”、“fast” 或毫秒。
可选的 callback 参数是动画完成后所执行的函数名称。
当动画 100% 完成后,即调用回调函数 Callback。
#如何设置和获取元素内部 HTML 内容?如何设置和获取元素内部文本?
html();获取html内容,有值的话就是设置html内容
$('div').html();//获取内容
$('div').html('<p>我是段落</p>');//设置内容
text();获取文本元素,有值的话就是设置文本内容
$('p').text();//获取文本
$('p').text('我不是段落')//设置文本
#如何设置和获取表单用户输入或者选择的内容?如何设置和获取元素属性?
$('input').val()//获取
$('input').val('hello')//设置
设置和获取元素属性
$('input').attr('type')//获取属性,属性名不能为空
$('input').attr('sex','women')//设置
网友评论