jQuery基础使用与样式篇
1. 认识JQ：
jQuery是一个JavaScript函数库。
jQuery是一个轻量级的"写的少，做的多"的JavaScript库。
jQuery库包含以下功能：
1.HTML 元素选取 2.HTML 元素操作 3.CSS 操作 4.HTML 事件函数5.JavaScript 特效和动画
6.HTML DOM 遍历和修改7.AJAX8.Utilities 除此之外，jQuery还提供了大量的插件
- 通过jQuery处理DOM的操作，可以让开发者更专注业务逻辑的开发；
不需要我们具体知道哪个DOM节点有那些方法；
不需要关心不同浏览器的兼容性问题；
2. jQuery的语法：（详细内容见jquery.api.3.2.1）
jQuery语法是通过选取 HTML 元素，并对选取的元素执行某些操作
基础语法：$(selector).action();
- $美元符号定义jQuery
- selector 选择符需要查找的元素 支持css1~css3中的主流选择器
- action() 执行对元素的操作
例如：
$("p").hide();//隐藏所有 <p> 元素
3. JQ选择器: （详细内容见jquery.api.3.2.1）
ID选择器 $("#idname");
class选择器 $(".classname");
element元素选择器 $("标签名称");
全选择器 $("*")
层级选择器:
$("ancestor descendant") 后代选择器：选择给定的祖先元素的所有后代元素。
$("parent > child") 子选择器：parent的直接子元素
$("prev + next") 相邻兄弟选择器：匹配所有紧接在 prev 元素后的next 元素
$("prev ~ siblings")一般兄弟选择器：匹配 prev 元素之后的所有siblings 元素
3. 运用JQ：
- $(document).ready(function(){ });简写形式为$(function(){ });
- 修改CSS样式中的内容：
- 修改HTML中的内容：
1. $(element).html()方法：
- 针对获取元素的所有内容。
2. $(element).text()方法：
- 仅针对文本内容。
- 添加HTML中的内容：
4. JQ对象与DOM对象的相互转换:
5. JQ操作属性的方法：
Attribute（Attr）
①.获取或则设置属性attr()
②.移出属性removeAttr(name)
Property（prop）
①.获取或则设置属性prop() 与attr()一致
②.移出属性removeProp(name)与removeAttr一致Attribute（Attr）与Property（prop）的区别：
Attribute（Attr）
- attribute是HTML中就有的，是元素的选项|附加项。
例如：id、class、title、src、alt、href
- 值只能为string类型
- 客户端向HTML元素添加的自定义的属性，推荐称为attribute
Property（prop）
- JS DOM中，对象的成员(组成部分)，所以可以用JS DOM对象访问property(用对象访问成员)
例如：tagName, nodeName, nodeType, defaultChecked (这几个属性是DOM对象中属性)
- 值类型多样化：property因为是对象的成员，类型可多样化(boolean,string, number等)
- prop()不能获取自定义属性
- 如果获取DOM对象中的属性，推荐使用property
6. 添加、移除类:
7. JQ中的val（）方法：
$(ele).val()方法主要是用于处理表单元素的值,比如 input, select 和 textarea。
//JavaScript中的value属性
1. $(ele).val() 获取匹配的元素集合中第一个元素的当前值
2. $(ele).val(value) 设置匹配的元素集合中每个元素的值
- 通过$(ele).val()处理select元素， 当没有选择项被选中，它返回null
- $(ele).val()方法多用来设置表单的字段的值
- 如果select元素有multiple（多选）属性，并且至少一个选择项被中，
- $(ele).val()方法返回一个数组，这个数组包含每个选中选择项的值
8.JQ事件：