javascript类库 就是对js的一些常用的函数和对象进行封装,方便用户使用,且兼容性相当好 document.getElementById() function g(value){ return document.getElementById(value); } 常见的js类库: jquery:轻量级 ExtJs:收费 重量级的 BootStrap:响应式js类库jquery的导入 通过script标签的src属性导入即可 jquery对象的获取 通过$(选择器)就可以获取jquery对象jquery对象和dom对象之间的转换 dom===>jquery 通过$(dom对象)就可以转换成jquery对象 jquery===>dom jquery可以看成是一个数组 方式1: 通过jquery对象.get(索引) 方式2: 通过jquery对象[索引]选择器: 基本选择器: id选择器 $("#id值") class选择器 $(".class值") 元素选择器 $("标签名") 全部选择器 $("*") 选择多个,多个选择器用","分隔 $("#id值,.calss值") 基层选择器: 子孙关系 a b $("a b"):所有的后代 父子关系 a>b $("a>b"):a下的所有b孩子 下一个兄弟 a+b $("a+b"):a后面的第一个兄弟 后面所有兄弟 a~b $("a~b"):a后面的小弟 基本过滤选择器: ☆ :first :last :not(selector) :even 索引为偶数的 :odd 索引为奇数的 :eq(index) 等于 :gt(index) 大于 :lt(index) 小于 (了解) :header 标题 针对h标签 :animated 执行动画 :focus 获取焦点 内容过滤选择器:☆ :contains(text) 包含指定内容 例如:选取含有文本“di”的div元素 $("div:contains('di')") :empty 没有子节点的元素 节点:元素节点 属性节点 文本节点 文档节点document 例如:选取不包含子元素(或者文本元素)的div空元素 $("div:empty") :has(selector) 含有指定节点 例如:选取含有class为mini元素 的div元素 $("div:has(.mini)") :parent 有子节点的元素 例如:选取含有子元素(或者文本元素)的div元素 $("div:parent") 可见性过滤选择器:☆ :hidden 不可见的元素(主要指 display:none input type="hidden") :visible 扩展:遍历 方式1:对象的each方法 对象.each(fn) 方式2:jquery的each方法 $.each(数组,fn) 属性选择器: [attribute]☆ 含有指定属性 [attribute=value]☆ 含有指定属性并且值固定 (了解) [attribute!=value] 指定属性不为指定值(包含没有此属性) [attribute^=value] 属性值以指定内容开头 [attribute$=value] 属性值以指定内容结尾 [attribute*=value] 属性值含有指定内容 [attrSel1][attrSel2][attrSelN] 复合属性选择器,需要同时满足多个条件才能使用 子元素过滤选择器: :nth-child(序号) 第几个孩子 例如:选取每个class为one的div父元素下的第2个子元素 $("div.one>:nth-child(2)") :first-child 第一个孩子 例如:选取每个class为one的div父元素下的第一个子元素 $("div.one>:first-child") :last-child 最后一个孩子 例如:选取每个class为one的div父元素下的最后一个子元素 $("div.one>:last-child") :only-child 独生子 例如:如果class为one的div父元素下的仅仅只有一个子元素,那么选中这个子元素 $("div.one>:only-child") 表单过滤选择器(了解) :input 表单子元素 input select textarea button(等价于 ) :text 文本框 :password 密码框 :radio 单选框 :checkbox :submit :image :reset :butoon