引入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. Unidirectional TSP UVA - 116 多段图的最短路
			
    题目:题目链接 思路:从后往前进行dp,用next数组记录字典序最小的那一条路径 AC代码: #include <iostream> #include <cstdio> #in ...
    
			
    2. 
						
  2. 51nod_1445 变色DNA 最短路模板 奇妙思维
			
    这是一道最短路模板题,但是在理解题意和提出模型的阶段比较考验思维,很容易想到并且深深进入暴力拆解题目的无底洞当中. 题意是说:给出一个邻接矩阵,在每个点时,走且仅走向,合法路径中编号最小的点.问题是是 ...
    
			
    3. 
						
  3. MySQL之架构与历史（一）
			
    MySQL架构与历史 和其他数据库系统相比,MySQL有点与众不同,它的架构可以在多种不同的场景中应用并发挥好的作用,但同时也会带来一点选择上的困难.MySQL并不完美,却足够灵活,它的灵活性体现在很 ...
    
			
    4. 
						
  4. 如何使用PowerShell管理Windows服务
			
    [TechTarget中国原创] 作为一名系统管理员,最常见的任务之一就是学会管理Windows服务,这是保证Windows服务器和客户端正常运行的重要内容. 许多操作系统和应用程序都依赖于这些服务. ...
    
			
    5. 
						
  5. IOS开发学习笔记014-ARC机制
			
    ARC 1.ARC机制 2.ARC 判断准则 3.注意事项 4.ARC和非ARC混合使用 ARC机制 ARC 是编译器特性,而不是 iOS 运行时特性,它也不是类似于其它语言中的垃圾收集器.因此 AR ...
    
			
    6. 
						
  6. jmeter+ANT+Jekins性能自动生成测试报告脚本（模板），加入：Median TIme、90%、95%、99%、QPS、以及流量显示
			
    <?xml version="1.0"?><xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/T ...
    
			
    7. 
						
  7. Python-S9-Day99——Web前端框架之Vue.js
			
    01课程安排 02let和const: 03 箭头函数 04 对象的单体模式 05 Node.js介绍和npm操作 06 Webpack,babel介绍和Vue的第一个案例 01课程安排 1.1 ht ...
    
			
    8. 
						
  8. [oldboy-django][2深入django]FBV + CBV + 装饰器
			
    FBV django CBV & FBV - FBV function basic view a. urls 设置 urls(r'^test.html$', views.test) b. vi ...
    
			
    9. 
						
  9. 【转】unity自带寻路Navmesh入门教程（二）
			
    http://liweizhaolili.blog.163.com/blog/static/16230744201271210237616/ 上一节简单介绍了NavMesh寻路的基本用法,这次来介绍一 ...
    
			
    10. 
						
  10. Hadoop入门第五篇:Hive简介以及部署
			
    标签(空格分隔): Hadoop Hive hwi 1.Hive简介   之前我一直在Maxcompute上进行大数据开发,所以对数仓这块还算比较了解,在接受Hive的时候基本上没什么大的障碍.所以, ...
    
			
    11.