jQuery快速入门知识重点

1、jquery中attr与prop的区别

 

attr：是通过setAttribute 和 getAttribute来设置的使用的是DOM属性节点

 

prop:是通过document.getElementById()[name] = value 来实现的,通常用来设置checked selected

 

2、window.onload、window.onresize、window.onscroll、$(document).ready(function(){})四者的区别

 

1、window.onload:当文档加载完毕以后   包括html,js,img,css

 

2、window.onresize：当窗口发送改变的时候,高频率出发事件

 

3、window.onscroll:当滚动条滚动的时候，高频率出发事件

 

4、$(document).ready(function()({})

 

3、jquery中动画的形式有哪几种？

 

1、基本动画

    show()

 

    hide()

 

    toggle()

 

2、滑动动画

    slideUp()

 

    slideDown()

 

    slideToggle()

 

3、淡入淡出动画

    fadeIn()

 

    fadeOut()

 

    fadeTo()

 

    fadeToggle()

 

4、自定义动画

 

    animate()

4、如何停止动画和延迟动画

 

.stop()：停止动画

 

.delay():延迟动画

 

5、jquery中节点的操作有哪些？

 

children():获取所有子节点

 

find():查找后代元素

 

next():下一个元素

 

prev():上一个元素

 

parent():获取父级元素

 

siblings():获取同级元素

 

6、jquery中ajax的书写方式及参数

 

$.ajax({

    type:请求方式,

    url:"接口地址",

    data:"传递的参数",

    dataType:"数据类型",

    success:成功的回调,

    error:失败回调

 

})

 

7、jquery中 width()、innerWidth、outerWidth的区别

 

width():只会获取content内容区的宽度

 

innerWidth():会获取content+padding的宽度

 

outerWidth():会获取content+padding+border的宽度

 

8、jquery中offset()、position()、scrollTop()

 

offset():获取当前元素距离页面之间的偏移量

 

position():获取当前元素距离以定位的父元素的偏移量

 

scrollTop():获取滚动条滚动的距离

 

116、$(document).height() 与 $(window).height()的区别

 

$(documemt).height()：获取整个页面的高度  类似于原生js里面的document.body.clientHeight

 

$(window).height():获取可视区的高度   类似于原生js里面的document.documentElement.clientHeight

 

9、jquery中事件绑定、委托中  bind()  live() delegate()、on()之间的区别

 

bind:为每个元素绑定事件处理函数

 

解绑事件：unbind()

 

缺点：

    无法对未来元素实现事件绑定

 

 

 

live:为所有匹配的元素添加事件处理函数，未来元素也可以绑定事件处理函数

 

解绑事件：die()

 

缺点：

    1、1.7版本后不再支持该方法

 

    2、阻止事件冒泡不管用

 

live:是通过冒泡的方式来绑定到元素上的。更适合列表类型的，绑定到document DOM节点上。一旦事件冒泡到document上，jQuery将会查找selector/event metadata,然后决定那个handler应该被调用

 

 

 

 

delegate:为指定的元素(子元素)添加一个或多个事件处理函数

 

解绑事件：undelegate()

 

在某些浏览器下是有兼容性问题

 

更精确的小范围使用事件代理，性能优于.live()。它不会把所有的event全部绑定到document,而是由你决定把它放在哪儿

 

on: 为匹配的元素绑定一个活多个事件处理函数

 

解绑事件：off()

 

缺点：

    on不能取代live

 

整合了之前的三种方式的新事件绑定机制。.bind(), .live(), .delegate()都是通过.on()来实现的，.unbind(), .die(), .undelegate(),也是一样的都是通过.off()来实现的。

 

10、如何对一个jquery对象扩展方法？

 

$.extend():扩展jquery对象本身

 

例：

    $.extend({

        min:function(a,b){

            return a>b?b:a;

        },

        max:function(a,b){

            return a>b?a:b;

        }

    })

 

$.min();

 

11、如何对一个jquery元素扩展方法？

 

$.fn.extend():扩展jquery元素方法

 

例：

    $.fn.extend({

        zyh:function(info){

            return this.each(function(){this.innerHTML = info})

        }

    })

 

$("p").zyh("你好");

 

12、jquery中 trigger()的作用及用法

 

trigger:触发元素身上的某类事件

 

例：

    $("p").on("zyh",function(){

        alert(1)

    })

 

    $("p").trigger("zyh");

 

简单来说trigger就是自动执行某一个事件不需要手动触发

 

13、jquery中$.proxy()的作用及用法

 

$.proxy():返回一个新的函数，并且这个函数始终保持了特定的作用域

 

参数1：要改变作用域的函数

 

参数2：一个Object，参数1的作用域会被设置到这个Object上面

 

作用：可以解决this的指向问题，以及回调函数嵌套的问题

 

14、$(this) 和 this 关键字在 jQuery 中有何不同

 

$(this) 返回一个 jQuery 对象，你可以对它调用多个 jQuery 方法

 

而 this 代表当前元素，它是 JavaScript 关键词中的一个，表示上下文中的当前 DOM 元素。你不能对它调用 jQuery 方法

 

15、jQuery 中的方法链是什么？使用方法链有什么好处

 

方法链是对一个方法返回的结果调用另一个方法，这使得代码简洁明了，同时由于只对 DOM 进行了一轮查找，性能方面更加出色。

 

16、哪种方式更高效：document.getElementbyId("myId") 还是 $("#myId")？

 

第一种，因为它直接调用了 JavaScript 引擎。

 

17、JQ中find()、has()和filter()区别？

 

filter()方法，条件作用于自身

 

has()方法条件是作用于它的后代元素中

 

find():当前选中元素的上下文中找到符合条件的后代，返回的是子元素