jQuery知识点总结(第一天)

整理笔记前的题外话:

   我认为互联网的高速发展其中最为主要的一点就是——开源。

开源精神,使得无数的IT爱好者贡献所学,将自己的智慧结晶无偿奉献给大家。后辈的学习者在混沌的互联网世界里,追寻着前辈们留下的足迹,亦步亦趋的前往更高的层楼。开源精神,大大减少了后辈们在学习技术的难度,使得技术的升级和迭代日新月异。我希望成为一名思维开阔的人,成为对互联网有贡献的开源人。

我是后端PHP程序员,很少写前端页面。在做项目的过程中,被jQuery的便捷性所吸引。因此购买了《锋利的JQuery》一书,最近一边看书,一边总结书中的知识点,一边练习书中提供的案例。笔记里面的知识点也是总结《锋利的jQuery》里面的。希望我的笔记能让大家有所收获,如果笔记中有不对的地方,或者对我总结的知识点不太理解。可以在本文的评论区评论,我看到会会及时回复。还可以发邮件给我:[email protected](谢绝广告邮件)。



 jQuery选择器

1、基本选择器

        ID选择器    $("#id");            对应CSS里面id选择器     #id{ with : 100px; height : 200px }

        类选择器    $(".class");                                      对应CSS里面类选择器    .class{ width : 100px;}

        元素选择器          $("div");                                          对应CSS里面的元素选择器    p { color:red }

        匹配所有              $("*");                                             同上对应

合集选择器           $("#id , .class , div ");                     同上对应

最后一个【合集选择器】名字是我杜撰的。意思就是可以把#id  和 .class 以及 div共同组成一个大的集合。

2、层级选择器

        ○ 后代选择器(不仅选择儿子,孙子也不放过)           $("body div");

                      ○ 子代选择器(只选择儿子)                                                    $("body >div");

○ 下一个兄弟选择器(只选择下一个【同辈】元素)                  $("div + div");

          ○ 后面的所有兄弟选择器(选择自己后面所有的【同辈元素】)  $("prev ~ siblings");

notice:  siblings    同胞,兄弟。

3、过滤选择器

        ○ 选取集合元素中的第一个                                                       $(".class:first");

        ○ 选取集合元素最后一个元素                                                    $(".class:last");

        ○ 改变集合中部位某个特征的其余元素                                      $("div:not(‘.one‘)");

eg:老师:这个班级里面不是处女的同学出来排成一队。

           一女:报告老师,没破的算吗处女吗?

                假设整个班级集合为  .class

            不是处女的集合为       .no

            那么出来排队的剩余集合应该这样写  :  $(".class:not(‘.no‘)");

          ○ 选择索引为偶数的集合                                                         $(".class:even")     even 是偶数的意思。可以音译为伊文,女孩子名字。默认索引是从0开始。

          ○ 选择索引为奇数的集合                                                         $(".class:odd")      odd  是奇数,奇怪的人的意思。奇怪的人都是单身狗,dog odd。索引从0始

          ○ 选择索引值等于 n 的元素                                                     $(".class:eq(5)");    选择.class中索引值等于5的那个元素。索引从0开始。

          ○ 选择索引值大于 n 的元素                                                     $(".class:gt(5)");     选择.class中索引值大于5的元素。索引从0开始。

          ○ 选择索引值小于 n 的元素                                                     $(".class:lt(5)");       选择.class中索引值小于5的元素。索引从0开始。

○ 选择标题元素如h1----h6                                                     $(":header");

          ○ 选择页面中正在执行动画的元素                                            $("animated")         animated   动画的。

          ○ 选择页面中当前获取焦点的元素                                            $(":focus")               focus  关注。

notice : 页面中当前获取焦点的元素。什么事焦点。比如登录百度的时候,鼠标不用点击输入框,光标直接定位在输入框里。这就是运用了focus事件。

    还有我们利用【Tab】键 的时候也会触发这个事件。

    有获取焦foucus就有失去焦点blur。



笔记其实已经写在了本子上。只是一边回忆,一边往电脑上打而已。

剩余的内容,每天一更。

         

时间: 2024-10-27 04:22:14

jQuery知识点总结(第一天)的相关文章

jquery知识点梳理

jQuery知识点梳理 一.              jquery选择器 基本选择器 ID选择器 类选择器 标记选择器 分组选择器 通配符选择器 层次选择器 $(“ancestor descendent”):祖先后代选择器    空格 $(“parent > child”):父子选择器   大于 $(“prev + next”):相邻后兄弟元素选择器   加号 $(“prev ~ siblings”):所有后兄弟元素选择器  波浪线 过滤选择器:基本过滤选择器 :first.:last.:od

bash脚本编程的语法知识点总结第一部分

bash脚本编程的所有语法知识点总结第一部分 名词概念 bash脚本编程,从字面意思理解也就是shell脚本编程.bash应该是目前Linux上最流行的shell脚本解释程序.shell是一个命令语言解释器,而shell脚本则是Linux命令的集合,按照预设的顺序依次解释执行,来完成特定的.较复杂的系统管理任务,类似于Windows中的批处理文件. 1.shell脚本格式 第一行,顶格. eg: #!/bin/bash #!/usr/bin/python 其它的以#开头的行均为注释,会被解释器忽

jquery基础教程 - 第一章 JQUERY入门

Jquery基础教程 - 第一章 JQUERY入门 内容提要 1.jquery能做什么 2.jquery为什么如此出色 3.第一个jquery驱动的页面 4.纯javascript与jquery 5.开发工具 6.小结 1.jquery能做什么 取得文档中的元素 -- jQuery为准确的获得需要检查或操纵的文档元素,提供了可靠而富有效率的选择符机制. 找到所有应用了.content class样式的div中所有的P标签             $('div.content').find('p'

jquery如何获取第一个或最后一个子元素?

jquery如何获取第一个或最后一个子元素? 通过children方法,children("input:first-child") $(this).children("input:first-child").val(); $(this).children("input:last-child").val(); 通过>选择器,$(".items>input:first") 在这里转一篇<jQuery选择元素的方法

Jquery真的不难~第一回 编程基础知识

Jquery真的不难~第一回 编程基础知识 回到目录 前言 说Jquery之前,先来学习一下Javascript(以后简称为JS)语言中的基础知识问题,其时对于每种编程语言来说基础知识都是大同小异的,对变量,函数,条件语句块,循环语句块等等,而对于每种语言在写法上到是显得各有不同,如JS里在定义变量时,你要用var去声局部变量的声明,而对于弱类型的语言JS来说,你也可以不加var,但不加它会认为这个变量为全局变量,这是要注意的. 变量 在程序运行过程中,其值可以发生改变的(呵呵,10多年前书上的

2014年计算机软考《网络管理》知识点-【第一章】

51CTO学院,在软考备考季特别整理了"2014年计算机软考<网络管理>知识点",帮助各位学院顺利过关!更多软件水平考试辅导及试题,请关注51CTO学院-软考分类吧! 查看汇总:2014年计算机软考<网络管理>知识点汇总  第一章:计算机网络 1.1计算机网络发展简史 A)名词解释: (1) 计算机网络******地理上分散的多****立自主的计算机遵循规定的通讯协议,通过软.硬件互连 以实现交互通信.资源共享.信息交换.协同工作以及在线处理等功能的系统.(注解

[修练营]JQUERY、UML 第一梯次赠书名单公布 (目前尚有赠书名额,赶紧报名参加)

主题赠书名额目前尚有名额, 赶紧来参与JQUERY.UML.Chart Control.ASP.NET 四大主题. ?JQUERY 第一梯次赠书名单: alonstarjimmyyuhatelovehunterpo UML 第一梯次赠书名单: jimmyyuhunterpo??? chou 主题书籍将于10/12 寄送 ?主题赠书名额目前尚有名额, 赶紧来参与JQUERY.UML.Chart Control.ASP.NET 四大主题. 目前点部落持续提供 JQUERY.UML.Chart Con

jQuery知识点总结(第二天)

今天继续从我的笔记上面搬运.我们不产生知识,只是知识的搬运工. 内容过滤选择器: ○ 内容选择过滤器                                       $("div:contains('text')");   内容为'text'的那个div ○ 不包含子元素也不包含文本元素(一穷二白的选择器)   $("div:empty"); ○ 含有选择器所匹配元素的元素(真他妈绕口)              $("div:has(p)&q

jQuery 知识点总结

[文章根据 尚硅谷 教学材料 总结] 发博备查. 1.        . class选择器    # id选择器    : 选取 2. $(function(){})相当于 window.onload 方法.    window.onload = function(){...}    3. 加载DOM的两种方式: jQuery 和 window.onload    $(document).ready(function(){...})    $(function(){...} 4. 选取butto