JQuery

简介

JQuery是对JavaScript封装的一个框架包，简化对JavaScript的操作
JavaScript代码：获得页面节点对象、ajax元素节点对象实现、事件操作、事件对象
jquery代码：无需考虑浏览器兼容问题、代码足够少

JQuery：JavaScript+Query

jquery-2.1.4.js
链接：https://pan.baidu.com/s/1JZX4dIJO4AqAkm554BZXhQ?pwd=kysh 
提取码：kysh

选择器

1. 基本选择器

$('#id属性值') —— document.getElementById()
$('tag标签名') —— document.getElementsByTagName();
$('.class属性值') —— class属性值选择器
$('*') —— 通配符选择器
$('s1,s2,s3') —— 联合选择器

2. 层次选择器

$(s1 s2)
后代选择器：在s1内部获得全部的s2节点（不考虑层次）

$(s1>s2)
直接子元素选择器：在s1内部获得s2的子元素节点（直接孩子，孙子不算）

$(s1 + s2)
直接兄弟选择器：在s1后边获得紧紧挨着的第一个兄弟关系的s2节点

$(s1~s2)
后续全部兄弟关系节点选择器：在s1后边获得全部兄弟关系的s2节点

3.基本筛选

first：匹配找到的第一个元素

last：匹配找到的最后一个元素

not：去除所有与给定选择器匹配的元素

even：匹配所有索引值为偶数的元素，从0开始计数

odd：匹配所有索引值为奇数的元素，从0开始计数

eq（index）：匹配一个给定索引值的元素，从0开始计数

gt（index）：匹配所有大于给定索引值的元素，从0开始计数

lt（index）：匹配所有小于给定索引值的元素，从0开始计数

header：匹配如h1，h2，h3之类的标题元素

4.内容过滤选择器

contains：包含内容选择器，获得节点内部必须通过表现包含指定的内容

empty：获得空元素（内部没有任何元素/文本）节点对象

has：内部包含指定元素的选择器

parent：寻找的节点必须作为父元素节点存在（必须是别人的父亲）

属性操作

<input type="text" class="apple orange" id="id" name="name" value="tom" address="beijing"/>

JS:

itnode.属性名称
itnode.属性名称=值;
itnode.getAttribute(属性名称);
itnode.setAttribute(属性名称, 值);

注：自定义的属性例如address，只能通过getAttribute方式。

jquery方式操作属性（attribute）：property

$().attr(属性名称);        //获得属性信息值
$().attr(属性名称, 值);        //设置属性的信息
$().removeAttr(属性名称);    //删除属性

css样式操作

$().css(name, value);    //设置
$().css(name);        //获取

样式获取

jquery可以获取行内、内部、外部的样式，dom方式只能获得行内样式

复合属性样式需要拆分为“具体样式”才可以操作

background需要拆分为background-color background-image等进行操作
border：border-left-style border-left-width border-left-color等

dom对象转换为JQuery对象

$(dom对象)

$(this).prop("checked", !$(this).prop("checked"));

JQuery中attr()和prop()方法的区别

具有true和false两个值的属性，如checked，selected或者disabled使用prop()，其他的使用attr()