六、jQuery基础
jQuery:集合Dom/BOM/Js的类库
参考文献：http://jquery.cuishifeng.cn/index.html
参考博客：https://www.cnblogs.com/wupeiqi/articles/5369773.html
导入:相当于放在编辑的文档文件中：官网下载的是js文件，有两个文件，本地测试可以用正常版本，正常上线的时候用压缩版的，例如：jquery-1.12.4.js，推荐使用1系列的最新版本，兼容性比较好,2和3版本会忽略低版本的浏览器。
我们在使用jquery的时候，也是要先把jquery的css文件放入工程里面，但是不用link导入，而是在编写JavaScript脚本的时候再导入,如下：
导入方法：
<script src='jquery-1.12.4.js'></script>
<script>
jQuery.（也可以写成$('#i1'),一般都是用$这个方法）
</script>
jquery和Dom之间的转换：
$('#id')[0] 就可以转换成Dom对象document.getElementById('i1')
d=document.getElementById('i1'), $(d)就可以将Dom对象转换成jquery对象;
tips：
在使用别人的样式时，如果你想要编辑或者添加一个小图标(https://fontawesome.com/icons?from=io),只需要在这个网站下载他们的样式打包文件下来，解压到自己的工程项目里面，在<title>标签下面用<link>标签引入他们的css文件，然后再找到你想要的小图标的标签源码复制到你的html文件想要黏贴的位置即可，这种方法可以减少代码编写量，但是修改就比较麻烦，如果要将自己想要渲染的样式覆盖掉他们的样式，就必须在自己定义的style中添加的样式后面加上!important，示例：
<link rel="stylesheet" href="/static/bootstrap.ss">
<style>
.c1{
!important;
}
</style>
这样，自己渲染的c1类的背景颜色就编程了红色，覆盖了引入的css样式里面定义好的背景颜色了。
一、查找元素:选择器，直接找到某个或者某类标签
1.id
$('#id')
2.class
<div class='c1'></div>
$('.c1')
3.标签
<a>...</a>
$('a')
4.选择多个标签（组合选择）
$('a,c1,#id')
5.层级选择,和方法4不同的是，查找的元素之间用空格隔开；
$('a c1 #id') 子子孙孙
$('a>child')，$('a+child')，$('a~child') 只找儿子
6.基本和属性的选择参考相关网站
实例：
jquery循环：$('...').each(function(){})，例如反选实例，全选或者多选不需要后面的each，jquery默认是会自动循环的 注意function里面要有this，代表当前循环的每一个元素，这里的this是Dom对象
$(this).prop('key','value') jquery获取和设置属性方法，prop方法是专门针对checked和selected的
三元运算：var v=条件 ？真值：假值
筛选：在选择器选择到的所有元素中再次进行选择，例如：
$(this).next() 紧挨着的下一个标签
$(this).prev() 紧挨着的上一个标签
$(this).parent() 获取父标签
$(this).children() 获取所有的孩子标签
$(this).siblings() 获取除了自身的所有兄弟标签
$(this).find('.c1/#id') 通过find找到.c1/$id的标签
添加样式：$('').addClass()
删除样式 $('').removeClass()
js还支持链式编程，就是说可以将多个操作都通过jquery的.写成一条语句
其他jquery的功能请参考网站：http://jquery.cuishifeng.cn/
文本操作：(这些知识点可以练习模态框)
$(...).text() 获取文本内容
$(...).text('xxx') 设置文本内容，如果内含标签，不会解析，直接作为字符串
$(...).html() 获取内含标签的内容
$(...).html('xxx') 设置值
$(...).val() 相当于Dom中的value，获取值
$(...).val(‘’) 相当于Dom中的value，设置值
样式操作：
$(.c1).removeClass('hide')
$(.c1).addClass('hide')
开关操作：$(.c1).toggleClass('hide'),实现显示或者消失
属性操作
$('').attr（） 专门用来做自定义属性，可以获取和修改属性
$('').removeAttr（） 专门用来做自定义属性，可以删除属性
$('').prop（） 专门用于chekbox,radio进行的操作
$('').index() 获取索引值
TAB切换菜单：
文档处理：
$('').append() 子标签最后添加一个标签
$('').prepend() 字标签最前面添加一个标签
$('').after() 标签下面添加一个平级标签
$('').before() 标签上面添加一个平级标签
$('').eq(index).remove() 删除一个标签
$('').eq(index).empty() 清空一个标签的内容
$('').eq(index).clone() 复制一个标签
css某一条样式的修改：
$('').css('样式名称','样式值')
点赞功能实现：
-$('').append()
-setInterval定时器
-透明度
-opsition
-大小，位置
位置操作：(可以实现移动窗口位置的功能)
-$('').remove()
-$(window).scrollTop() 获取右侧滑轮位置，
-$(window).scrollTop(100) 设置右侧滑轮到100，
-$('').offset() 获取指定标签在html中的坐标
-$('').offset().left() 获取指定标签在html中离左边距离
-$('').offset().right() 获取指定标签在html中离右边距离
其他操作参考上面网站。
事件：Dom：三种绑定
jquery：
$('.c1').click()
$('.c1').bind('click'.function(){})
$('.c1').unbind('click'.function(){})
比较特殊的方式：$('.c1').delegate('a','click'.function(){}) 根据标签绑定，这种叫委托，当代码执行的时候其实没有绑定事件，当进行点击了时候才绑定执行事件
$('.c1').undelegate('a','click'.function(){})
上面几种绑定都是下面的on绑定方法的扩展
$('.c1').on('click',function(){})
$('.c1').off('click',function(){})
阻止事件发生：
这些绑定的事件都是后来绑定的，执行先后顺序为，后来绑定的优先于标签默认自带的先执行，如a标签，当添加的事件加上return false时，后面的事件不会执行，如果是ruturn true 就会执行后面的；注意，通过Dom绑定事件，标签中的事件绑定要加上return（onclick='return Foo()'），用jquery绑定的在函数里面添加return函数就行;（表单提交验证的时候可以用这个功能）
默认事件先执行标签：Checkbox标签；
自定义事件先执行：a,submit...标签；
登陆注册框实现代码实例：
当页面框架加载完成之后自动执行：代码是由上至下执行的，一般图片太大的时候会有延迟，图片框架有了，但是内容还没有显示，所以将script代码放在这个函数体内可以优先执行，不用等图片全部加载完成
$(function(){})
扩展:里面是字典形式的
第一种：
$.extend({
'扩展名1':function(){...},
'扩展名2':function()(...),
'扩展名3':function()(...),
})
var v=$.扩展名();
alert(v);
第二种：
$.fn.extend({
'扩展名1':function(){...},
'扩展名2':function()(...),
'扩展名3':function()(...),
})
var v=$(‘选择器’).扩展名();
alert(v);
以后可以引入网上其他人写的扩展方法，写在一个文件里，但是要像引入jquery一样引入这个文件，当映入的两个扩展名字相同，而且又都有全局变量的时候，这个时候就可以在扩展文件里面用自执行函数，也可以带参数例如：带上参数(jQuery),这样扩展文件里面的就都是局部变量了
正则：
js中创建正则表达式对象：/匹配符/
test 判断字符串是否符合规定的正则
rep=/\d+/;
rep.test('asdfgsgsg34g')
返回true
rep=/^\d+$/ 这种匹配就是开头结束都是数字才返回ture
exec 获取/提取匹配的数据
rep=/\d+/;
rep.exec('asd45sgsg34g')
返回的只有[‘45’],是一个列表，而且只有一个，
验证过程：
1、前端：验证
2、后端：python验证实现
3、业务处理
