引入jquery

本地引用

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

网络引用

谷歌CDN

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

微软CDN

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

使用格式

$(selector).action()

$固定表示为 jQuery

selector要查找名字

action() 执行的动作

文档就绪函数

$(document).ready(function(){

});

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

选择器

1. 元素选择器

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

$("#id").method()

用元素查找

$("p").method()

用元素的id  和 class

$("p.intro") 选取所有 class="intro" 的 <p> 元素。

$("p#demo") 选取所有 id="demo" 的 <p> 元素。


类名查找 “ .类名”




$(".class").method()




2.属性选择器




$("[href]") 选取所有带有 href 属性的元素。

$("[href='#']") 选取所有带有 href 值等于 "#" 的元素。

$("[href!='#']") 选取所有带有 href 值不等于 "#" 的元素。

$("[href$='.jpg']") 选取所有 href 值以 ".jpg" 结尾的元素。




例如




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




3.CSS 选择器


用于改变 HTML 元素的 CSS 属性




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




等...


jQuery 事件函数


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


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




<html>

<head>

<script type="text/javascript" src="jquery.js"></script>

<script type="text/javascript">

$(document).ready(function(){

  $("button").click(function(){

    $("p").hide();

  });

});

</script>

</head>

<body>

<h2>This is a heading</h2>

<p>This is a paragraph.</p>

<p>This is another paragraph.</p>

<button>Click me</button>

</body>

</html>




jQuery 名称冲突




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


												


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

    
						
  1. jQuery $.each用法[转]
		
    jQuery $.each用法 以下内容非原创,来自百度文库http://wenku.baidu.com/view/4796b6145f0e7cd18425368e.html 通过它,你可以遍历对象. ...
    
		
    2. 
						
  2. jQuery 事件用法详解
		
    jQuery 事件用法详解 目录 简介 实现原理 事件操作 绑定事件 解除事件 触发事件 事件委托 事件操作进阶 阻止默认事件 阻止事件传播 阻止事件向后执行 命名空间 自定义事件 事件队列 jque ...
    
		
    3. 
						
  3. jquery cookie 用法
		
    jquery cookie 用法 $.cookie("name","value","options")  当不设置options时,此coo ...
    
		
    4. 
						
  4. [转]Jquery Ajax用法
		
    原文地址:http://www.php100.com/html/program/jquery/2013/0905/6004.html jQuery学习之jQuery Ajax用法详解 来源:   时间 ...
    
		
    5. 
						
  5. JQuery datepicker 用法
		
    JQuery datepicker 用法   jQuery UI很强大,其中的日期选择插件Datepicker是一个配置灵活的插件,我们可以自定义其展示方式,包括日期格式.语言.限制选择日期范围.添加 ...
    
		
    6. 
						
  6. jquery.cookie用法详细解析，封装的操作cookie的库有jquery.cookie.js
		
    jquery.cookie用法详细解析 需要注意存入cookie前,对数据进行序列化, 得到后在反序列化: 熟练运用:JSON.stringify();和JSON.parse(): 通常分为如下几个步 ...
    
		
    7. 
						
  7. jquery.post用法补充(type设置问题)
		
    jquery.post用法 http://blog.csdn.net/itmyhome1990/article/details/12578275 当使用ajax获取data数据的时候,直接data.f ...
    
		
    8. 
						
  8. jQuery -- 光阴似箭（一）：初见 jQuery -- 基本用法，语法，选择器
		
    jQuery -- 知识点回顾篇(一):初见jQuery -- 基本用法,语法,选择器 1. 使用方法 jQuery 库位于一个 JavaScript 文件中,其中包含了所有的 jQuery 函数.  ...
    
		
    9. 
						
  9. jQuery 动画用法
		
    jQuery动画: <head> <meta charset="UTF-8"> <title>Title</title> <s ...
    
		
    10. 
						
  10. jquery cookie用法
		
    jquery cookie用法(获取cookie值,删除cookie) cookie在jquery中有指定的cookie操作类,下面我先来介绍我们在使用cookie操作类时的一些问题,然后介绍正确的使 ...
    
		
    11. 
		

	


随机推荐
	

    
									
  1. [Hdu3555] Bomb（数位DP）
			
    Description 题意就是找0到N有多少个数中含有49. \(1\leq N \leq2^{63}-1\) Solution 数位DP,与hdu3652类似 \(F[i][state]\)表示位 ...
    
			
    2. 
						
  2. Maven使用入门
			
    Maven使用POM文件管理项目资源,pom.xml文件位于项目根目录下,结构如下: <?xml version="1.0" encoding="UTF-8&quo ...
    
			
    3. 
						
  3. 2018安恒杯11月月赛  MISC
			
    题目放评论了 Numeric password 这次隐写没有按照套路出牌,很强. 记录一下 看来自主学习的能力很有待提高. 打开Numeric password.txt 中华文化博大精深,近日在教小外 ...
    
			
    4. 
						
  4. python 删除重复文件 附源代码
			
    啥也不说了,直接上源码 #! /usr/bin/env python #coding=utf-8 import os import md5 import time def getmd5( filena ...
    
			
    5. 
						
  5. Visual C++网络五子棋游戏源代码
			
    说明:网络对战版的五子棋,VC++游戏源码,带音乐,可设置网络最终网络下棋,通过源代码你将了解到设置菜单状态.服务器端口申请.客户机申请连接.发送数据.游戏编写.监听和使用套接字.主菜单对象定义等基础 ...
    
			
    6. 
						
  6. 单元测试如何保证了易用的API
			
    一般而言TDD的好处是以输出为导向及早发现问题,以及方便重构(单元测试保证).我理解,还有一个比较重要的意义是: 客观上强制了程序员写出更加友好的接口 方便测试和联调. 问题 这里我以c++举例,需求 ...
    
			
    7. 
						
  7. java中json依赖包
			
    Exception in thread "main" java.lang.NoClassDefFoundError: org/jaxen/JaxenException 上面的是do ...
    
			
    8. 
						
  8. mysql 修改密码 开启远程访问权限
			
    修改密码 update user set password=password('') where user='root'; FLUSH   PRIVILEGES; 远程访问权限: GRANT ALL  ...
    
			
    9. 
						
  9. BZOJ 4326：NOIP2015 运输计划（二分+差分+lca）
			
    NOIP2015 运输计划Description公元 2044 年,人类进入了宇宙纪元.L 国有 n 个星球,还有 n−1 条双向航道,每条航道建立在两个星球之间,这 n−1 条航道连通了 L 国的所 ...
    
			
    10. 
						
  10. BZOJ1415 [Noi2005]聪聪和可可  【SPFA + 期望dp记忆化搜索】
			
    题目 输入格式 数据的第1行为两个整数N和E,以空格分隔,分别表示森林中的景点数和连接相邻景点的路的条数. 第2行包含两个整数C和M,以空格分隔,分别表示初始时聪聪和可可所在的景点的编号. 接下来E行 ...
    
			
    11.