本文共 2608 字，大约阅读时间需要 8 分钟。

一、补充

     :checked 选择器 选中所有被选中的复选框      $('被选中的复选框:checked')     //获取到所有被选中的复选框 二、尺寸——位置 1、尺寸          1.1、$('css选择器').css('width')      //获取匹配元素当前计算的宽度值  .width   带单位          1.2、$('css选择器').width()   // 获取匹配元素当前计算的宽度值  .width()   不带单位   (只读)          1.3、$('css选择器').innerWidth()    // 获取匹配元素内部区域宽度 .innerWidth() width + padding   (只读)          1.4、$('css选择器').outerWidth()   // 获取匹配元素的外部宽度 .outerWidth() width + padding + border  (只读)          1.5、$('css选择器').outerWidth(true)//设置为 true 时，计算边距在内 .outerWidth(true)  (width+padding+border+margin)   (只读) 2. 位置          2.1、$('css选择器').css('left')    // 获取匹配元素的left值 .css('left')          2.2、$('css选择器').position()  // 获取匹配元素相对父元素的偏移 .position() {left:值,top:值}  (只读)          2.3、$('css选择器').offset()     // 获取匹配元素在当前文档的相对偏移,以文档的左上角为参照  .offset()     {left:值,top:值}            2.4、$('css选择器').offset({left:值,top:值})   //设置位置          三、 卷入语法 1、滚动条产生有2种方式:        1.1、文档滚动条: 标签高度超出屏幕        1.2、 盒子滚动条: overflow-y: auto; (前提是有固定高度, 内容超出盒子容器高度) 2、滚动事件  .scrollTop()      2.1、 滚动事件scroll：监听谁在滚动；注册给给有滚动条元素；      2.2、 获取卷入高度；被卷入JQ标签对象.scrollTop(); 也可以设置后影响滚动位置

例:

     2.3、scrollTop(值) 不光可以获取卷入高度,还可以设置

例：

3、注意点：

     3.1、document是文档不是标签 ,没有样式属性去使用,所以不能用document设置动画       3.2、兼容：$('html, body')是为了兼容标准模式和怪异模式的scrollTop的值，因为如果没有顶部的DOCTYPE声明,就会以怪异模式来解析这个文档, 设置scrollTop只有body才能生效，如果有DOCTYPE声明,就会以html5标准模式,来解析这个文档的代码,设置scrollTop时以html才能生效      3.3、为什么$()的document不写引号，是因为document本身就是一个变量(文档对象)  - 不是css选择器,所以直接转换，但是 $("html,body")用的是标签名css选择器,所以css选择器需要加引号 四、创建-添加-删除-克隆 1、创建---借助字符串来创建

例：let newP = $('
我是一个创建出来的p标签
')

1、添加标签

1.1、$('CSS选择器').append(newP)     //内部  向当前元素内部追加内容（内部末尾追加）---append()1.2、$('CSS选择器').prepend(newP)     //内部  向当前元素内部前置内容（内部头部追加）---prepend()1.3、$('CSS选择器').before(newP)     //兄弟  向当前元素之前插入内容（在目标前面兄弟位置插入标签）---before() 1.4、$('CSS选择器').after(newP)     //兄弟  向当前元素之后插入内容（在目标后面兄弟位置插入标签）---after()

2、删除标签  

$('CSS选择器').remove()---从dom中删除匹配的元素---remove()     注意：删除的是DOM元素中‘CSS选择器’这个元素

3、克隆---克隆匹配的元素

例： let theDiv = $('#myDiv').clone();      //再添加进去     $('body').append(theDiv);

五、本地存储

1、存储  localStorage.setItem('设置的属性名','值') 2、获取  localStorage.getItem('属性名') 3、注意：本地存储只能存储字符串, 所以转换成JSON字符串  (JSON格式要求除了数字和布尔, 只能用双引号)      3.1、存储的是复杂数据类型  - 将复杂数据类型转化成JSON字符串   

 let obj = {        a:1,        b:2      }   localStorage.setItem('myObj',JSON.stringify(obj))

    3.2、获取- 将值转换成JSON的格式        

JSON.parse(localStorage.getItem('myObj'))

4、一般从本地存储里取数据

     //先获取本地存储的内容，若无则获取一个空数组     let dataArr = JSON.parse(localStorage.getItem('设置的属性名'))  ||   [ ]；     //然后再存     localStorage.setItem('todolist', JSON.stringify(dataArr))       // 需要去管理本地的数组

六、删除某一项

      .splice(参数一，参数二) 方法---删除某一项 参数一就是下标, 参数二是个数 七、一些注意事项       动态创建的一个标签，不要直接给标签注册事件，利用事件委托 - 既能给现在的标签还能给将来的标签委托一个点击事件，因为JavaScript无法感知新添加的元素（也就是说即便你为其它与该元素相同的元素添加了事件，也无法应用到该元素下），所以说在这样的情况中,我们利用事件委托,找到父级或者更外层的元素去绑定实现会更好一些。

转载地址：https://blog.csdn.net/Bear_with_her/article/details/117932828 如侵犯您的版权，请留言回复原文章的地址，我们会给您删除此文章，给您带来不便请您谅解！