jquery

是一个模块 一个库 js封装的一个库

导入jq

 <script src="jquery.js"></script>  
 <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
 $  ==  Jquery
 dom对象 _> jq对象
 $(dom对象)
 jq对象 _> dom对象
 jq对象[0]

选择器

基本选择器

 通用选择器  $('*')
 标签选择器 $('div')
 id选择器   $('#id')
 类选择器   $('.class')
 
 组合选择器 $('div.class1')     并集
          $('div,p')     交集

层级选择器

 后代选择器    $('div span') 
 子代选择器   $('#li>span')
 毗邻选择器   $('#li+span')
 弟弟选择器   $('#li~span')

属性选择器

 $('[属性]')
 $('[属性="值')
 $('[属性!="值')
 $('[属性^="值')
 $('[属性$="值')
 $('[属性*="值')

筛选器

 $('选择器:筛选器')
 :first   第一个
 :last   最后一个
 :eq(index) 按照索引
 :has(选择器) 包含某个子代的父标签
 :not(选择器) 排除

筛选方法

 .first()  last
 .eq(index)
 .siblings() 兄弟
 .parent()
 .children()
 .next() .nextAll() .nextUntil('#l2')
 .prev() .prevAll() .prevUntil()
 .has() 包含某个子代的父标签
 .filter('#l2')   当前标签包含选择器
 .not(选择器)     不包含

值的操作

 .text()   文本
 .html() HTML标签

绑定事件

 $('button').click(function () {
        alert(123)
 })

标签的操作

 父标签.append(子标签)     // 子标签添加到父标签的子代的最后
 子标签.appendTo(父标签)  
 
 
 父标签.prepend(子标签)     //   子标签添加到父标签的子代前面
 子标签.prependTo(父标签)  
 
 a.after(b)   // 在a标签后面添加b标签
 a.before(b) // 在a标签前面添加b标签
 

删除

 .remove()  删除标签和事件
 .detach() 删除标签 保留事件
 .empty()   清空标签中的内容

克隆 复制

 .clone()       复制标签
 .clone(true)   复制标签 也有事件

替换

 a.replaceWith(b)    //  用b替换a
 b.replaceAll(a)     // 用b替换a   a可以是标签 选择器

属性的操作

 .attr('属性')  // 获取属性的值
 .attr('属性','值') // 设置属性的值
 .removeAttr('属性') // 删除某个属性
 
 .prop('checked')   // radio checkbox select(option)
 .prop('checked',true)

值的操作

 val()
12-27 11:07