引入jquery

本地引用

  1. <script src="jquery-3.2.1.js"></script>

网络引用

谷歌CDN

  1. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js">

微软CDN

  1. <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.0.js">

使用格式

  1. $(selector).action()

$固定表示为 jQuery

selector要查找名字

action() 执行的动作

文档就绪函数

  1. $(document).ready(function(){
  2.  
  3. });

为了防止在页面为加载完就执行

选择器

1. 元素选择器

用定义的id名查找，前面加#

  1. $("#id").method()

用元素查找

  1. $("p").method()

用元素的id  和 class

  1. $("p.intro") 选取所有 class="intro" 的 <p> 元素。
  2. $("p#demo") 选取所有 id="demo" 的 <p> 元素。
  1.  

类名查找 “ .类名”

  1. $(".class").method()

2.属性选择器

  1. $("[href]") 选取所有带有 href 属性的元素。
  2. $("[href='#']") 选取所有带有 href 值等于 "#" 的元素。
  3. $("[href!='#']") 选取所有带有 href 值不等于 "#" 的元素。
  4. $("[href$='.jpg']") 选取所有 href 值以 ".jpg" 结尾的元素。

例如

  1. $("[name='name']").method()

3.CSS 选择器

用于改变 HTML 元素的 CSS 属性

  1. $("p").css("background-color","red");

等...

jQuery 事件函数

事件处理程序指的是当 HTML 中发生某些事件时所调用的方法

jQuery 代码放到一般放在部分 <head></head>之间

  1. <html>
  2. <head>
  3. <script type="text/javascript" src="jquery.js"></script>
  4. <script type="text/javascript">
  5. $(document).ready(function(){
  6.   $("button").click(function(){
  7.     $("p").hide();
  8.   });
  9. });
  10. </script>
  11. </head>
  12.  
  13. <body>
  14. <h2>This is a heading</h2>
  15. <p>This is a paragraph.</p>
  16. <p>This is another paragraph.</p>
  17. <button>Click me</button>
  18. </body>
  19.  
  20. </html>

jQuery 名称冲突

  1. var jq=jQuery.noConflict()，帮助您使用自己的名称（比如 jq）来代替 $ 符号

(1)jquery基本用法的更多相关文章

  1. jQuery $.each用法[转]

    jQuery $.each用法 以下内容非原创,来自百度文库http://wenku.baidu.com/view/4796b6145f0e7cd18425368e.html 通过它,你可以遍历对象. ...

  2. jQuery 事件用法详解

    jQuery 事件用法详解 目录 简介 实现原理 事件操作 绑定事件 解除事件 触发事件 事件委托 事件操作进阶 阻止默认事件 阻止事件传播 阻止事件向后执行 命名空间 自定义事件 事件队列 jque ...

  3. jquery cookie 用法

    jquery cookie 用法 $.cookie("name","value","options")  当不设置options时,此coo ...

  4. [转]Jquery Ajax用法

    原文地址:http://www.php100.com/html/program/jquery/2013/0905/6004.html jQuery学习之jQuery Ajax用法详解 来源:   时间 ...

  5. JQuery datepicker 用法

    JQuery datepicker 用法   jQuery UI很强大,其中的日期选择插件Datepicker是一个配置灵活的插件,我们可以自定义其展示方式,包括日期格式.语言.限制选择日期范围.添加 ...

  6. jquery.cookie用法详细解析，封装的操作cookie的库有jquery.cookie.js

    jquery.cookie用法详细解析 需要注意存入cookie前,对数据进行序列化, 得到后在反序列化: 熟练运用:JSON.stringify();和JSON.parse(): 通常分为如下几个步 ...

  7. jquery.post用法补充(type设置问题)

    jquery.post用法 http://blog.csdn.net/itmyhome1990/article/details/12578275 当使用ajax获取data数据的时候,直接data.f ...

  8. jQuery -- 光阴似箭（一）：初见 jQuery -- 基本用法，语法，选择器

    jQuery -- 知识点回顾篇(一):初见jQuery -- 基本用法,语法,选择器 1. 使用方法 jQuery 库位于一个 JavaScript 文件中,其中包含了所有的 jQuery 函数. ...

  9. jQuery 动画用法

    jQuery动画: <head> <meta charset="UTF-8"> <title>Title</title> <s ...

  10. jquery cookie用法

    jquery cookie用法(获取cookie值,删除cookie) cookie在jquery中有指定的cookie操作类,下面我先来介绍我们在使用cookie操作类时的一些问题,然后介绍正确的使 ...

随机推荐

  1. Cube HDU - 1220（思维）

    Cowl is good at solving math problems. One day a friend asked him such a question: You are given a c ...

  2. Postgres安装详解

    PG安装 一．基础包的安装(yum源的配置,可以采用光盘挂载,及ftp yum源,针对外网环境忽略此步): yum -y install wget tcpdump glibc libgcc gcc g ...

  3. V4L2学习（三）框架分析

    整个v4l2的框架分为三层: 在应用层,我们可以在 /dev 目录发现 video0 类似的设备节点,上层的摄像头程序打开设备节点进行数据捕获,显示视频画面.设备节点的名字很统一,video0 vid ...

  4. SSRS 制作报表时报错： 超时时间已到。在操作完成之前超时时间已过或服务器未响应。

    转载注明出处,原文地址:http://www.cnblogs.com/zzry/p/5718739.html  在用ssrs 制作报表时报如下错误 错误信息截图: 看到如上错误第一个想到的解决方法就是 ...

  5. Thread和Runnable的子类调用

    实现线程的两种方式: 继承Thread类. 实现Runnable接口. 下面是一个小案例: public class Thread和Runnable { public static void main ...

  6. Spring MVC 使用 HttpServletResponseWrapper 修改返回结果

    HttpServletResponseWrapper 是什么? ServletResponse 的包装类,相关设计模式 装饰者模式. 运行环境 jdk 1.7 spring boot 整合的web环境 ...

  7. 【Interleaving String】cpp

    题目: Given s1, s2, s3, find whether s3 is formed by the interleaving of s1 and s2. For example,Given: ...

  8. Windows网络编程笔记4 -- Winsock 协议相关知识

     Win32平台上的Winsock编程,Winsock是一个与协议无关的接口.以下协议是我们需要了解的: 网络协议的特征包括: 1.  面向消息 2.  面向连接和无线接 3.  可靠性和次序性 4. ...

  9. Wordpress 数据库查询错误 Call to a member function get_results() on null

    在插件中的一个文件使用如下代码,无法查询 <body> <?php global $wpdb; $sql = ""; $sql = "SELECT * ...

  10. LINUX SHELL脚本攻略笔记[速查]

    Linux Shell脚本攻略笔记[速查] 资源 shell script run shell script echo printf 环境变量和变量 pgrep shell数学运算 命令状态 文件描述 ...