引入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. The Tower of Babylon UVA - 437 DAG上的动态规划
			
    题目:题目链接 思路:每个方块可以用任意多次,但因为底面限制,每个方块每个放置方式选一个就够了,以x y为底 z 为高,以x z为底 y 为高,以y z为底 x为高,因为数据量很小,完全可以把每一种当 ...
    
			
    2. 
						
  2. Android拨打电话不弹出系统拨号界面总结
			
    我在网上搜了一下,解决这个问题,有两种方式: 1.反射调用系统底层方法,并获取系统权限 反射调用的代码如下: Class phoneFactoryClass = Class.forName(" ...
    
			
    3. 
						
  3. 「微信小程序免费辅导教程」25，基本内容组件text的使用及个人帐号允许的服务类目
			
    
			
    4. 
						
  4. mysql练习题练习
			
    1.数据库是按照原文制作的,表格结构一样具体存储的数据有些差异 原文地址:MySQL练习题 原答案地址:MySQL练习题参考答案 2.查询“生物”课程比“物理”课程成绩高的所有学生的学号: selec ...
    
			
    5. 
						
  5. windows服务自动备份数据库
			
    最近写了几个windows服务用于自动备份与删除数据: services代码如下: public partial class Service1 : ServiceBase { public Servi ...
    
			
    6. 
						
  6. Win7系统安装MySQL5.5.21图解
			
    Win7系统安装MySQL5.5.21图解 大家都知道MySQL是一款中.小型关系型数据库管理系统,很具有实用性,对于我们学习很多技术都有帮助,前几天我分别装了SQL Server 2008和Orac ...
    
			
    7. 
						
  7. 设置CMD默认代码页为65001或936
			
    之前不知道怎么改的,CMD的代码页被默认设置成了65001   但我右击CMD标题,选择‘默认值’,显示默认却是936,但为何每次打开都是65001呢   上网找到设置默认值的方法 1 win键+R打 ...
    
			
    8. 
						
  8. Django框架学习-01Django介绍
			
    01-Django介绍 02-HTTP协议介绍 01-Django介绍 1.什么是Web框架? 随着Web最新发展趋势的不断升级,Web项目开发也越来越难,而且需要花费更多的开发时间.所以,Web程序 ...
    
			
    9. 
						
  9. Map的常用方法keySet()、entrySet()
			
    Map是java中的接口,Map.Entry是Map的一个内部接口. Map提供了一些常用方法,如keySet().entrySet()等方法,keySet()方法返回值是Map中key值的集合:en ...
    
			
    10. 
						
  10. 一些NGINX配置
			
    一些nginx配置 使用独立目录, 然后include具体配置 gzip on for multi processers static file cache proxy pass 静态目录 or 文件 ...
    
			
    11.