zoukankan      html  css  js  c++  java
  • 《深入PHP与jQuery开发》读书笔记——Chapter1

    由于去实习过后,发现真正的后台也要懂前端啊,感觉javascript不懂,但是之前用过jQuery感觉不错,很方便,省去了一些内部函数的实现。

    看了这一本《深入PHP与jQuery开发》,感觉深入浅出,值得推荐。

    Chapter1.jQuery简介

    1.jQuery工作方式本质

    先创建一个jQuery对象实例,然后对传递给该实例的参数表达式求值,最后根据这个值作出相应的响应或者修改自身。

    2.利用CSS语法选择dom元素(基本选择器)

    我们知道,jQuery说白了就是对网页上的内容进行选择器的新建与操作。

    • 通过标签类型选择元素

    直接选用标签的元素来作为选择器:

    $("p")
    • 通过class选择元素

    通用格式:.class

    $(".foo")
    • 通过ID选择元素

    通用格式:#id

    $("#bar")
    • 使用组合选择题

    只要元素匹配组合选择器中任意一个选择器,都会被选中并出现在返回结果中:

    $("p.foo,#bar")

    3.层次选择器

    • 选择后代元素

    祖先元素  后代元素

    例:选择body下的span元素

    >>>$("body span")
    • 选择子元素

    父元素>子元素(只匹配直接子元素)

    >>>$("body>span")
    >>>[]
    • 选择下一个兄弟(next)元素

    起始元素标识+下一个兄弟元素标识

    注意是在DOM中选择一个元素之后紧跟的下一个兄弟元素!!

    >>>$(".foo+p");
    • 选择兄弟元素

    兄弟元素(sibling elements)是指被同一个元素包裹的同一级全部元素。选择兄弟元素非常类似于选择下一个元素,只是它返回起始元素之后匹配的全部兄弟元素,而不是只返回下一个。

    起始元素标识~匹配兄弟元素

    >>>$(".foo~p");

    4.基本过滤器

    • 选择第一个或最后一个元素

    只要在任意选择器之后追加:first或:last即可:

    >>>$("p:first");
    >>>$("p:last");
    • 选择不匹配某个选择器的元素

    使用:not()过滤器。

    >>>$("p:not(.foo)");
    • 选择索引为奇数或偶数的元素

    :even 和 :odd

    >>>$("p:odd");
    >>>$("p:even");
    • 选择特定索引的元素

    :eq()过滤器。

    >>>$("p:eq(3)");

    5.内容过滤器

    •  匹配包含特定文本的元素

    要匹配包含特定文本的元素,使用:contains()过滤器。(仅匹配标签内的文本)

    >>>$("p:contains(Another)");
    • 匹配包含特定元素的元素

    :has()过滤器用来匹配包含特定元素的元素。

    >>>$("p:has(span)");
    • 选择空元素

    :empty()选择出那些不包含任何文本也不包含任何其他元素的空元素。

    >>>$(":empty");
    • 选择父元素

    与:empty相反,:parent只匹配那些拥有子元素的元素,不管它包含的是其他元素,还是文本内容,或者兼而有之。

    >>>$("p:parent");

    6.可见性过滤器

    利用:hidden和:visible,分别用来选择被隐藏的元素和可看到的元素。

    >>>$("p:visible");  //可见的
    >>>$("p:hidden"); //隐藏的

    7.属性过滤器

    • 根据属性及属性的值选择元素:

    [属性名=属性值]

    >>>$("[class=foo]");
    • 选择没有某个属性的元素或属性值不匹配的元素

    [属性名!=属性值]

    $("[class!=foo]");

    8.子元素过滤器

    • 匹配奇数索引值/偶数索引值/特定索引值的元素

    :nth-child()在匹配元素时提供了4个参数:even,odd,index和equation。

    >>>$("p:nth-child(odd)");
    >>>$("p:nth-child(even)");
    • 选择第一个或最后一个子元素

    使用:first-child;last-child

    >>>$("p span:last-child");

    关于选择器:last()和:last-child()的区别:

    这两个选择器都是匹配集合中的最后一个元素,差别在于 :last 将匹配所有的集合中的最后一个元素。而 :last-child 将匹配集合中的所有位置为最后一个的子元素。:last 将永远返回一个元素,而 :last-child可能返回一批元素。

    9.表单过滤器

    目前可用的表单选择器(暗含对input框内type的选择)有:button,:checkbox,:file,:image,:input,:password,:radio,:submit,:text.

    如:

    >>>$("input:radio");
    • 匹配可用或禁用的表单元素
    >>>$(":enabled");
    >>>$(":disabled");
    • 匹配选中或未选中的表单元素

    过滤器:checked和:selected分别用于获取checked为真和selected为真的表单元素。

    >>>$(":checked");
    >>>$(":selected");

    就这样吧。

  • 相关阅读:
    P1962 斐波那契数列(矩阵加速DP)
    P1939 【模板】矩阵加速(数列)
    剑指04.重建二叉树
    剑指03.从尾到头打印链表
    剑指02.替换空格
    剑指01.二维数组中的查找
    Python绘图学习笔记(待完善)
    时间观念 目标观念
    购房交税
    可以不做会计,但是不能不懂会计
  • 原文地址:https://www.cnblogs.com/sysu-blackbear/p/4055553.html
Copyright © 2011-2022 走看看