jquery封装了JavaScript常用的功能代码,提供一种简便的JavaScript设计模式,优化HTML文档操作、事件处理、动画设计和Ajax交互。

核心关键字: 链式、多功能、高效灵活

 

1.安装jquery

  1)npm下:

npm install jquery

  2)文件引入:

  <script src="./jquery/jquery.min.js"></script>

  3)cdn在线引入

<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">

  ps:日常demo使用jquery.js,这样格式更清晰,而项目上线时则推荐使用迷你版,它精简了大量空格,

提高了效率

2.在script中的使用

  在script中,将“ $ ”(数字4键上的美元符号)比作jquery,换句话说,$在JavaScript中指的就是jQuery,jQuery对象与JavaScript对象是不同的

  1)jq的入口函数

  所有的jQuery语句都被包裹在一个$入口函数中

  $(function() {
// jq函数写在这里
});

  你也可以像下面这样写,不过通常按照上面写比较简洁:

$(document).ready(function(){

   // jq函数写在这里

});

  引入js的window.onload:

  window.onload函数是指当html和css加载完毕后执行的js文件,这样是为了防止出现页面还未加载完毕,js就出现在了页面中的这种意外事故。通常写在head标签内,(当然要写在script内)

  $(document).ready()函数正是对标js的window.onload,然而,它 与window.onload也有几点不同:

    a:$(document).ready()函数可以没有加载限制,这意味着,你可以将它写在任意一个你喜欢的地方(前提是外面要有script包裹)

    b:js的window.onload只能写一次,而$(document).ready()可以写多次。

3.jQuery的各种选择器

    jq的强项就是精于各种dom操作,这一点在选择器上就可以看出来

    通用语法:

 $(function() {
$(" 选择器 ").method() //找到某个dom元素并对它进行操作
})

  

 

    标签选择器:

 $(function() {
$(" button ").method() //找到button伪数组并对它们进行操作
})

  请注意!除非保证只有一个,标签选择器通常找到的是一类伪数组,要想对某个标签操作建议后加eq()

 $(function() {
$(" button:eq(0) ").method() //此时选中了第0个button标签
})

    类选择器:

$(function() {
$(".btn").method() //选择了类名为btn的元素并对其操作
})

    id选择器

$(function() {
$("#btn").method() //选择了id为btn的选择器并对其操作
})

 如果你是初学者,了解了上面的选择器就会发现--其实与css的选择器是一样的

4.各类方法

  a.  on() 向被选元素添加事件处理程序

  

$(function() {
$("#btn").on("click",function(){
//找到#btn元素并为它添加点击事件
})
})

  第一个参数是事件名,第二个是一个回调函数

jquery复习日记(1)的更多相关文章

  1. jQuery 复习

    jQuery 复习 基础知识 1, window.onload $(function(){});   $(document).ready(function(){}); 只执行函数体重的最后一个方法,事 ...

  2. Jquery 复习练习(01)

    Jquery 复习练习 window.onload = function() {} == $(function() {}); 千万注意:js对象和jq对象的区别,这也是常常犯的错误 js对象举例: w ...

  3. ②jquery复习

    # jQuery 复习--by 传智前端与移动开发学院 ## 1. jQuery是什么?(了解)+ www.github.com+ jQuery 其实就是一堆的js函数,是普通的js,只不过应用广泛, ...

  4. PJ初赛复习日记

    PA姑娘的PJ初赛复习日记 by Pleiades_Antares PJ初赛考试马上就要开始了(今年应该是10.13吧?),作为蒟蒻的我们怎么能不复习呢? 众所周知,复习方法有很多很多种-- 比如 ( ...

  5. jquery复习笔记

    Jquery基础 让一个按钮灰掉 $("button").("disabled","true"); ance desc选择器(ance代表祖 ...

  6. Jquery 复习练习(02)Javascript 与jquery 互转 onclick 与click区别

    Javascript 与jquery 互转 jquery 为<script src="jquery-1.8.3.js"></script> 以checkbo ...

  7. 2016/4/21 关于jquery复习

    jQuert AJAX [1]jQuery load()方法 :是AJAX方法, 从服务器加载数据,并把数据放入被选元素中 语法: $(selector).load(URL,data,callback ...

  8. jquery 学习日记之选择器

    看完Jquery选择器的教程视频后,对jquery的选择器有一定的认识和了解,现整理一下知识: 一.jquery基本选择器,这类比较简单,一笔带过. #id 选择器,是选择  匹配id值中的第一个元素 ...

  9. JavaSE复习日记 : 算是个小前言吧

    /* * Java也学了好久了,抽个时间整理了一下课堂笔记,也有些是我刚开始学会犯的一些错误.在这里浅谈一下JavaSE的基础内容,对我来说也是一种不错的复习方式. * * 那好,对于初学者来说,学习 ...

随机推荐

  1. CodeForces 988 F Rain and Umbrellas

    Rain and Umbrellas 题意:某同学从x=0的点走到x=a的点,路上有几段路程是下雨的, 如果他需要经过这几段下雨的路程, 需要手上有伞, 每一把伞有一个重量, 求走到重点重量×路程的最 ...

  2. Codeforces 898 B(拓展欧几里得)

    Proper Nutrition 题意:有n元钱,有2种单价不同的商品,是否存在一种购买方式使得钱恰好花光,如果有输入任意一种方式,如果没有输出“NO” 题解:可以使用拓展欧几里得快速求解. #inc ...

  3. JOBDU 1109 连通图

    题目1109:连通图 时间限制:1 秒 内存限制:32 兆 特殊判题:否 提交:4192 解决:2224 题目描述: 给定一个无向图和其中的所有边,判断这个图是否所有顶点都是连通的. 输入: 每组数据 ...

  4. 通过CMD命令窗口获取django版本号

    通过CMD命令窗口获取django版本号 方法一: C:\Users\Administrator>python >>> import django >>> d ...

  5. JS千分位格式化方法,以及多种方法性能比较

    方法一字符串版 function toThousands(num) { var result = '', counter = 0; num = (num || 0).toString(); for ( ...

  6. Asterisk13.23.1如何增加G723编码和G729编码

    文章主要将如何配置Asterisk G729的编码和G723的编码问题 今天在配置语音电话过程中踩到一个坑,就是在对接线路过程中出现了一个报错,在传到对方线路过程中出现无法转码从而导致报错. 查看了下 ...

  7. 面试必问的MySQL锁与事务隔离级别

    之前多篇文章从mysql的底层结构分析.sql语句的分析器以及sql从优化底层分析, 还有工作中常用的sql优化小知识点.面试各大互联网公司必问的mysql锁和事务隔离级别,这篇文章给你打神助攻,一飞 ...

  8. .Net基础篇_学习笔记_第六天_for循环的几个练习

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...

  9. crypto 的使用方法和说明

    crypto 模块提供了加密功能,包含对 OpenSSL 的哈希.HMAC.加密.解密.签名.以及验证功能的一整套封装.我们这里讲crypto AES算法加密 一.使用步骤 1.引入Crypto 1. ...

  10. mybatis源码专题(2)--------一起来看下使用mybatis框架的insert语句的源码执行流程吧

    本文是作者原创,版权归作者所有.若要转载,请注明出处.本文以简单的insert语句为例 1.mybatis的底层是jdbc操作,我们先来回顾一下insert语句的执行流程,如下 执行完后,我们看下数据 ...