jquery:js 库
官网：http://jquery.com/下载： downloadv3.1.1 - 最新版本3.x2.x1.xPast
Releases -- 过去发布的版本
See all versions of jQuery Core. -- 查看所有版本下载：
https://code.jquery.com/jquery/我们用的：jQuery Core 1.7.2 国内使用的，最稳定的版本
1.x : 亚非拉ie 6 7 8 9 ff chrome
2.x : 欧美不兼容 ie 6 7 83.
jquery : 用户群：不懂JS的人 (只会切图的前端 后台程序员)简单
原生js： 用户群：专业的前端工程师 难
jquery 能做的 原生 的JS 都能做到反之则不然
=========2016年11月23日 星期三 10：05：18 =========
获取元素：
document.getElementById // ByTagName
--$('input')
就是css 中的写法
jquery里获取元素： css 中怎么写 jquery 就怎么写
原： onclick
jq: click -- 事件不带on
*选择器
根据标签名： $('input')
根据ID： $('#btn1')
根据class: $('.classname')
根据属性来获取： [属性名='属性值'] // ' " 交叉用： 外单引里双引，外双引里单引
.eq(2) 按索引找元素
伪类：
:first
:last
:even
:odd
:eq(索引值)
:lt(4) 小于索引值
:gt(4) 大于索引值
:contains(文本) 包含指定文本的 (如：包含 a 字母)
:has(标签名) 包含指定标签的
设置样式：
.css('background','yellow'); //设置一个
.css({'background':'yellow','width':200}); 设置多个样式
显示： .show()
隐藏： .hide();
切换click事件，可以2个或多个： .toggle
mouseover
mouseout
--和原生的 on 事件，有同样的问题
移上，移走 切换的时候 ： hover
淡入淡出： fadeIn fadeOut
下拉显示： slideUp slideDown
--不推荐使用
动画：animate
--推荐使用
=========2016年11月23日 星期三 12：21：36 =========
样式：
.css('width'); //获取一个样式，带单位 200px
.css('background','yellow'); //设置一个
.css({'background':'yellow','width':200}); 设置多个样式
属性：
.attr('属性名') //获取一个属性
.attr('name','value'); //设置一个属性
.attr({
name1:'v1',
name2:20
}) //批量设置属性
=========2016年11月23日 星期三 14：27：25 =========
class操作：
addClass
removeClass
内容操作：
非表单元素的内容：
.html() 获取innerHTML
.html(设置的内容) 设置
表单标签：
.val() 获取内容
.val(设置的内容) 设置
=========2016年11月23日 星期三 14：35：40 =========
this:
一般情况下， this 还是原生 js 中的this
原生对象 jquery对象
* 原生对象的属性和方法，不能直接用于 jquery对象
* jquery对象的属性和方法， 不能 直接用于 原生对象
原生 --> jquery $(原生)
jquery --> 原生 [0]
=========2016年11月23日 星期三 15：07：32 =========
索引：
.index();
链式操作：
兄弟节点：siblings
=========2016年11月23日 星期三 15：40：31 =========
位置：
原生： offsetLeft offsetTop
left top
jquery:
var l = $('#div1').position().left;
var t = $('#div1').position().top;
普通位置：
.positon().left
.position().top
绝对位置：
.offset().left;
.offset().top;
=========2016年11月23日 星期三 16：02：39 =========
物体大小：
width heigth
宽度：
.width() 普通宽度
.innerWidth() 普通宽度 + padding
.outerWidth() 普通宽度 + padding + border
高度：height
=========2016年11月23日 星期三 16：34：17 =========
事件：=========2016年11月23日 星期三 16：49：20 =========
jquery 都是绑定
.bind();
.unbind();
事件委托：
$('ul').delegate('li','click',function(){
alert($(this).html());
});
$('ul').undelegate();
阻止默认行为：
return false; -- 阻止默认行为 和 事件冒泡
ev.preventDefault(); -- 阻止默认行为
ev.stopPropagation() -- 阻止事件冒泡
=========2016年11月23日 星期三 16：49：20 =========
可视区：
alert($(window).width());
alert($(window).height());
例子：
智能社 - www.zhinengshe.com
网友评论