JQuery


特点:1.被封装。2.链式表达式。3.自动协调浏览器的兼容性。4.非侵入性。

基本语法构:
    <script src="scripts/jquery-1.7.1.min.js"></script>
    <script language="javascript">
        //ready()是个事件,当HTML在浏览器中加载完成后触发
        $(document).ready(function () {
            //当页面加载完成后自动触发
            alert("aaa");
        });
    </script>
一、选择器——找到对象
(一)基本选择器
1.最基本
ID 选择器——#
class选择器——。
标签选择器——标签名
2.组合
并列关系——用逗号隔开
后代关系——用空格隔开
子级关系——用>隔开
(二)过滤选择器——使用:进行过滤。
1.基本过滤——按照元素在HTML中的排列次序进行过滤
:first,:last,:eq(n),:even,:odd,:not(选择器)

 $(".dd").css("margin","5px").css("float","left").css("background-color","yellow").css("border","5px solid red").css("width","100px").css("height","100px");
            //$(".dd:first").css("background-color", "blue");
            //$(".dd:last").css("background-color", "blue");
            //$(".dd:eq(4)").css("background-color", "blue");//等于第几个equal从0开始
            //$(".dd:even").css("background-color", "blue");//偶数
            //$(".dd:odd").css("background-color", "blue");//奇数
            //$(".dd:not(#d1)").css("background-color", "blue");//不包括

 2.属性过滤——[]
a.是否有这个属性——选择器[属性名]

 $(".dd[title]").css("background-color", "blue");

b.属性等于某个值——选择器[属性名=值]

$(".dd[title=hello]").css("background-color", "blue");

c.属性不等于某个值——选择器[属性名!=值]

$(".dd[title!=hello]").css("background-color", "blue");

d.属性以某个字符串开头——选择器[属性名^=值]

 $(".dd[title^=h]").css("background-color", "blue");//正则表达式

e.属性以某个字符串结尾——选择器[属性名$=值]

$(".dd[title$=o]").css("background-color", "blue");//正则表达式

f.属性中包含某个字符串——选择器[属性名*=值]

$(".dd[title*=o]").css("background-color", "blue");
 $(".dd[title=1234][thhhh]").css("background-color", "blue");//两级过滤以及多层过滤一直往后加【】就行

 3.内容过滤
a.通过子元素情况进行过滤——:has(选择器)

$(".dd:has(span)").css("background-color", "blue");
 $(".dd:has(span[class=ss])").css("background-color", "blue");

b.通过文本情况进行过滤——:contains(文字)

$(".dd:contains(水)").css("background-color", "blue");
原文地址:https://www.cnblogs.com/likaixuan/p/4566459.html