jQuery前端知识总结.docx

选择器ID选择器Jquery能使用CSS选择器来操作网页中的标签元素，如果你想要通过一个ID号去找一个元素，就可以使用如下格式的选择器：$(“#my_id”),其中#my_id表示根据选择器获取页面中指定的标签元素，且返回唯一一个元素。例：div id=”divtest”/divscript type=”text/javascript”$(“#divtes”).html(“设置div的内容”)/script在页面中 就会显示 设置div的内容元素选择器（element）类似于页面中的div、span各个元素，虽然同属于一个容器，但有各自的功能，jQuery中可以根据元素名查找元素，格式如下：$(“element”)例：div id=”divtest”我变胖了/divscript type=”text/javascript”$(“div”).css(“font-weight”,”bold”)script类别选择器 .class$(“.class”) 其中.class参数表示元素的CSS类别(类选择器)名称。4、*所有选择器 $(“*”) 选择器中的参数就一个“*”，既没有“#”号，也没有“.”号。 由于该选择器的特殊性，它常与其他元素组合使用，表示获取其他元素中的全部子元素。5、sele1、sele2、seleN选择器$(“sele1,sele2,seleN”)，其中参数sele1、sele2到seleN为有效选择器，每个选择器之间用“，”号隔开，它们可以是之前提及的各种类型选择器，如$(“#id”)、$(“.class”)、$(“selector”)选择器等。 $(“div,p”).html(“我的身份很特殊”);6、ance desc 选择器 其中ance desc是使用空格隔开的两个参数。ance参数（ancestor祖先的简写）表示父元素；desc参数（descendant后代的简写）表示后代元素，即包括子元素、孙元素等等。两个参数都可以通过选择器来获取。比如家族姓氏“div”，家族几代人里，都有名字里带“span”的，就可以用这个ance desc选择器把这几个人给定位出来。 7、parentchild 选择器与上一节介绍的ance desc选择器相比，parent child选择器的范围要小些，它所选择的目标是子集元素，相当于一个家庭中的子辈们，但不包括孙辈，它的调用格式如下：$(“parent child”)child参数获取的元素都是parent选择器的子元素，它们之间通过“”符号来表示一种层次关系。8、prev+next选择器 远亲不如近邻，通过prev+next可以查找prev的下一个元素，格式：$(“prev + next”)；9、prev~siblings 选择器 查找prev后面的同辈元素10、:first 过滤选择器过滤选择器，该类型的选择器是根据某过滤规则进行元素的匹配，书写时以“：”号开头,通常用于查找集合元素中的某一位置的单个元素。例：body div改变最后一行苹果背景颜色：/div ol li葡萄/li li香蕉/li li橘子/li li西瓜/li li苹果/li /ol script type=text/javascript $(li:last).css(background-color, red); /script /body11、:eq(index) 过滤选择器 如果想从一组标签元素数组中，灵活选择任意的一个标签元素，我们可以使用:eq(index)例：div改变中间行葡萄背景颜色：/div ol li橘子/li li香蕉/li li葡萄/li li苹果/li li西瓜/li /ol script type=text/javascript $(li:eq(2)).css(background-color, #60F); /script12、:contains(text) 选择器有时候我们可能希望按照文本内容来查找一个或多个元素，那么使用:contains(text)选择器会更加方便， 它的功能是选择包含指定字符串的全部元素，它通常与其他元素结合使用，获取包含“text”字符串内容的全部元素对象。其中参数text表示页面中的文字。div改变包含jQuery字符内容的背景色：/div ol li强大的jQuery/li lijavascript也很实用/li lijQuery前端必学/li lijava是一种开发语言/li li前端利器——jQuery/li /ol script type=text/javascript $(li:contains(jQuery)).css(background, green); /script13、：has(selector)过滤选择器 d