操作类：
js版本： jquery版本
classList.add() addClass()
classList.remove() removeClass()
classList.contains() hasClass()
classList.toggle() toggleClass()
css操作：
<p>111<p>
<p>222<p>
一行代码将第一个p标签变成红色第二个p标签变成绿色：
$('p').first().css('color,''red').next().css('color','green')
jquery的链式操作 使用jquery可以做到一行代码操作很多标签
jquery对象调用jquery方法之后返回的还是jquery对象 也就可以继续调用
了解：
位置操作：
offset() 定位的值 获取当前标签相对于窗口的偏移量
position() 元素相对于父标签的偏移量
$(window).scrollTop() 返回的值是数字 标识滑动页面的位置 右侧滚动条亲顶部的效果 可以用于制作回到顶部等功能,括号里面写数字 页面就跳到对应的部分$(window).scrollTop(0)
scrollLoft()左
尺寸：
$('p').height() 文本
$('p').width()
$('p').innerHeighe()文本+padding
$('p').innerWidth()
$('p').outerHeight() 文本+padding+border
$('p').outerWidth()
文本操作：
操作标签内部文本
js jquery
innerText text()括号内不加参数是获取 加了是获值
innerHTML html()
$('div').text() 拿到内部文本
$('div').text('你好') 拿到内部文本+标签，也可以再text内设置文本内容，不能识别标签
获取值操作
js juery
.value .val()
$('#d1').val()
$('#d1').val('天天开心') 括号内不加参数就是获取 加了就是设值
获取文件对象：
$('#d2')[0].files[0] 牢记两个对象之间的转换
属性操作
js jquery
setAttibute() attr(name,value) 设值
qetAttribute() attr(name) 获取
removeAttribute() removeAttr(name) 移除
在用变量储存对象的时候 js中推荐使用xxx.Ele 标签对象
jquery中推荐使用 $xxxEle jquery对象
对于标签上有的能够看到的属性和自定义属性用attr
对于返回布尔值 比如 checkbox radio option是否被选中用prop
$('#d2').prop('checked',true)
文档处理
js jquery
createElement() $('<p>')
appendChild() append()
let $Ele=$('<p>') 创建一个p标签
$pEle.text('写入文字')
$pEle..attr(id','d1') 设值
$('#d1').append($pEle) 内部尾部追加
spEle.appendTo($('#d1')) 向哪个位置追加
$('#d1').prepend($pEle) 放在某个标签后面
$pEle.prependTo($('#d1'))
$('#d1').before($pEle)
spEle.insertBefore($('#d2'))
$('#d1').remove()将标签从DOM树中删除 彻底删除
$('#d1').empty() 只删除内容 留下d1这个
jquery事件
第一种：
$('#d1').click(function(){
alert('你好')
})
第二种：（功能更强大 还支持事件委托）
$('#d2').on('click',function(){
alert('hello')
})
jquery两种绑定事件的方式
第一种
$('#d1').click(function(){})
第二种
$('#d1').on('click',function(){})
克隆事件
clone() 默认情况下只克隆标签不可控事件
clone(true)
自定义模态框
通过绑定事件控制标签类属性的添加和删除
this：之地啊的就是当前被操作的本身 有点像面向对象的self
左侧菜单 一行代码搞定 链式
返回顶部 $(window).scroll(function(){}) 监测滚动条
自定义登录校验功能
.val() 的使用
hover事件： 只放一个函数 进出都会触发 可以写两个
$('#d1').hover(function(){}) 进的时候一个
$('#d1').hover(function(){},
function(){}) 出的时候一个
input框实时监控输出事件
$('#d1').on('input',function(){}) 这种不行就换一种.input
键盘按键事件
$(window).keydown(function(event){}) 按键按下,通过event形参按键对应的数字
$(window).keyup(function(){}) 按键抬起
<b'#dutton id='d1'> </button>