jQuery

jQuery的常规使用:
1、提供强大的选择器
2、提供大量好用的方法,方便于我们进行DOM操作
3、对于处理的处理
4、提供丰富的动画效果
5、对应ajax进行封装

1、封装重复调用代码
2、解决一些IE 浏览器的兼容性

jQuery JavaScript的库(函数库)封装代码
框架一般是扩展代码 (angularJS reactJS vueJS)
jQuery的官方:http://jquery.com/
目前jQuery的版本主要分为三个分支:
1.x:
2.x:
3.x:

jQuery选择器:
1、基本选择器:
id选择器 #
class类选择器 .
element
逗号选择器
通配符 *
tag 标签选择器
+下一个选择器
2、包含选择器:
子代选择器 >
后代选择器 空格
3、属性选择器:
[title]
[title='xxxxxxxxxx']
[title*='xxxx']
[title^='xxxxxx'
[title$='xxxxx']
4、表单选择器:
:input
:text
:radio
:enabled
:disabled
:checked
:selected
5、过滤选择器:
eq() eq()
gt()
lt()
last() last()
first() first()
even()
odd()
parent
parents
next
nextaAll
siblings
chaindren
find
filter

动画方法是可以传递参数的,当参数是字符串时(slow normal fast)。
但参数是数字的时候,此时,该参数就是动画需要执行的毫秒数。

jQuery代码一般要求出现在ready函数中
在DOM加载完成后,会自动触发

面试题:jQuery ready和js 的window onload事件的区别。【
1.执行时间
window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行。
(document).ready()是DOM结构绘制完毕后就执行,不必等到加载完毕。 2.编写个数不同 window.onload不能同时编写多个,如果有多个window.onload方法,只会执行一个(document).ready()可以同时编写多个,并且都可以得到执行
3.简化写法
window.onload没有简化写法
(document).ready(function(){})可以简写成(function(){});
(document).ready(function(){ // 执行代码 }); 或者(function(){
// 执行代码
});
在我以前的开发中,一般用到javascript,我都是采用jquery的模式,也就是大多数时候,第一行写的是:
(document).ready(function(){ ... }); 这个时候,不一定要等所有的js和图片加载完毕,就可以执行一些方法,不过有些时候,必须要等所有的 元素都加载完毕,才可以执行一些方法的时候,比如说,部分图片或者什么其他方面还没有加载好,这个时候,点击某些按钮,会导致出现意外的情况,这个时候,就 需要用到:(window).load(function ()
{
$("#btn-upload").click(function ()
{
//比如说:
uploadPhotos();
});
});

面试题:find函数和filter函数的区别?
find向内部查找
filter只会过滤

动画
三类九种动画
show
hide
toggle
fadeIn
fadeOut
fadeToggle
slideDown
slideUp
slideToggle
animate
stop

jQuery事件

1、DOM
写在标签内的
如:<button onclick='test()'>点击</button>
首先获取DOM对象,之后调用DOM对象.事件属性
document.getElementById('show').onclick=fn(e)
2、DOM2
事件监听
document.getElementById('show').addEventListener('click',fn(e),ture);
jQuery上实现两种:
伪代码
('#show').click(fn(e))('#show').on('click',function(e){

     })

jQuery方法:
each(funcyion(index,item){})
length
attr() / prop() / removeAttr() / removeProp()

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 1.JQuery 基础 改变web开发人员创造搞交互性界面的方式。设计者无需花费时间纠缠JS复杂的高级特性。 1....
    LaBaby_阅读 4,906评论 0 1
  • 1.JQuery 基础 改变web开发人员创造搞交互性界面的方式。设计者无需花费时间纠缠JS复杂的高级特性。 1....
    LaBaby_阅读 5,214评论 0 2
  • jQuery笔记总结篇 poetries 已关注 2016.10.20 10:52* 字数 9137 阅读 660...
    小杰的简书阅读 5,718评论 2 32
  • 原文链接 http://blog.poetries.top/2016/10/20/review-jQuery 关注...
    前端进阶之旅阅读 16,749评论 18 503
  • 题目1: jQuery 中, $(document).ready()是什么意思? 定义和用法: 当 DOM(文档对...
    FLYSASA阅读 3,294评论 0 2