一、/*JQuery语法
* 1、jQuery("选择器").action（）;通过选择器调用实践函数，但是jquery中，jque可以用$（“选择器”）.action();
* ① 选择器，可以直接使用css选择器，选中元素
* ② .action表示对元素执行的操作
* 2、文档准备就绪：防止文档再完全加载（就绪）之前运行jquery代码
* $(document).ready(function(){//jquery代码});
* 或者简写方式$(function（）{});
* 【文档就绪函数和window.onload的区别】
* （1）windo.onload须在网页所有内容加载完成后执行，包括图片音频；而文档就绪函数，只需要在网页DOM结构加载后便执行
* （2）windo.onload只能写一个，写多个只会执行最后一个；文档就绪函数，可以写多个也不会覆盖
* 3、jQuery对象与原生DOM对象互转
* ① 原生DOM对象转jQuery对象：$(DOM对象)；
* var p = document.getElementsByTagName("p");
* $(p);//转换为jquery对象
* ① jQuery对象转原生DOM对象：$("#p").get(0) $("#p")[0]
* $("#p").get(0).style.color="red";
二、/* HTTP:超文本传输协议。
*
* URL：统一资源定位符
* 组成： 协议名://主机名(IP地址):端口号/项目资源地址?传递参数键值对#锚点
* eg: http://127.0.0.1:8080/jd/index.html?name=jianghao
*
* localhost或127.0.0.1表示本机IP
*
*/
/* JSON 对象
*
* 1、JSON对象是键值对的集合，键与值之间用":"分隔，多个键值对之间，用","分隔
* 2、多个JSON对象，可以放到数组中去。JSON对象和数组，可以相互嵌套；
*
* JSON的键，必须是字符串。
三、事件绑定快捷方式
/*$("button:first").click(function(){
alert(1);
});*/
/*
* 使用on绑定事件
*/
// ① 使用on进行单事件绑定
/*$("button").on("click",function(){
// $(this) 取到当前调用事件函数的对象
console.log($(this).html());
});*/
// ② 使用on同时为多个事件，绑定同一函数
/*$("button").on("mouseover click",function(){
console.log($(this).html())
})*/
// ③ 调用函数时，传入自定义参数
/*$("button").on("click",{name:"jianghao"},function(event){
// 使用event.data.属性名 找到传入的参数
console.log(event.data.name);
})*/
// ④ 使用on进行多事件多函数绑定
/*$("button").on({
click:function(){
console.log("click")
},
mouseover:function(){
console.log("mouseOver")
}
});*/
/* ⑤ 使用on进行事件委派
* >>> 将原本需要绑定到某元素上的事件，改为绑定在父元素乃至根节点上，然后委派给当前元素生效；
* eg：$("p").click(function(){});
* ↓
* $(document).on("click","p",function(){});
* >>> 作用：
* 默认的绑定方式，只能绑定到页面初始时已有的p元素，当页面新增p元素时，无法绑定到新元素上；
* 使用事件委派方式，当页面新增元素时，可以为所有新元素绑定事件
/* off() 取消事件绑定
*
* 1. $("p").off(): 取消所有事件
* 2. $("p").off("click"): 取消点击事件
* 3. $("p").off("click mouseover"):取消多个事件
* 4. $(document).off("click","p"):取消事件委派
*
*/
/*
* 使用.one() 绑定事件，只能执行一次
*/
/*$("button").one("click",function(){
alert(1);
})*/
/* .trigger("event")：自动触发某元素的事件
*
* $("p").trigger("click",["haha","hehe"]); 触发事件时，传递参数
*/
/*$("p").click(function(event,arg1,arg2){
alert("触发了P的click事件"+arg1+arg2);
})
$("button").click(function(){
$("p").trigger("click",["haha","hehe"]);
})*/
/********************************动画*************************************/
/* .show()：让隐藏元素显示，同时修改元素的宽度、高度、opacity属性
*
* ① 不传参：让隐藏的元素直接显示，不进行动画
* ② 传入时间：多少毫秒之内完成动画
* ③ 传入(时间,函数)：完成动画之后，执行回调函数
*
* .hide():让显示元素隐藏，与show()相反；
*
*
*
* .slideDown(): 让隐藏元素显示，效果为从上往下，增加高度
* .slideUp(): 让显示的元素隐藏，效果从下往上，减小高度
* .slideToggle():让显示的隐藏，让隐藏的显示
*
*
* .fadeOut(): 让显示元素隐藏，淡出
* .fadeIn()： 让隐藏元素显示，淡入
* .fadeToggle(): 让显示的隐藏，让隐藏的显示。淡入淡出
* .fadeTo(时间，透明度，函数):同fadeToggle，但是多了透明度参数，可以指定显示的最终透明度
*
*
* .animate({最终的样式属性键值对},动画时间,动画效果("linear" "swing"),回调函数)： 自定义动画
*
*/