`
北海肥猫
  • 浏览: 28853 次
  • 性别: Icon_minigender_1
  • 来自: 石家庄
社区版块
存档分类
最新评论

jQuery 简介

阅读更多

jQuery 是一个 JavaScript 库,它极大地简化了 JavaScript 编程。


1、jQuery 库包含以下特性:

  • HTML 元素选取
  • HTML 元素操作
  • CSS 操作
  • HTML 事件函数
  • JavaScript 特效和动画
  • HTML DOM 遍历和修改
  • AJAX
  • Utilities

2、如何向您的页面添加 jQuery 库?

如需使用 jQuery,您需要下载 jQuery 库,然后把它包含在希望使用的网页中。
下载jQuery:http://jquery.com/download/

 

jQuery 库是一个 JavaScript 文件,您可以使用 HTML 的 <script> 标签引用它:

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

 

3、jQuery 语法

jQuery 语法是为 HTML 元素的选取编制的,可以对元素执行某些操作。

 

基础语法是:$(selector).action();

  • 美元符号定义 jQuery
  • 选择符(selector)“查询”和“查找” HTML 元素
  • jQuery 的 action() 执行对元素的操作
示例:

$(this).hide(); // 隐藏当前元素
$("p").hide(); // 隐藏所有段落
$(".test").hide(); // 隐藏所有 class="test" 的所有元素
$("#test").hide(); // 隐藏所有 id="test" 的元素

 4、jQuery选择器

jQuery选择器分元素选择器和属性选择器,允许通过标签名、属性名或内容对 HTML 元素进行选择。

 

(1)jQuery 元素选择器

jQuery 使用 CSS 选择器来选取 HTML 元素。

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

 (2)jQuery 属性选择器

jQuery 使用 XPath 表达式来选择带有给定属性的元素。

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

 

更多的选择器实例:

$(this);	     //当前 HTML 元素
$("p");	             //所有 <p> 元素
$("p.intro");	     //所有 class="intro" 的 <p> 元素
$(".intro");         //所有 class="intro" 的元素
$("#intro");	     //id="intro" 的元素
$("ul li:first");    //每个 <ul> 的第一个 <li> 元素
$("[href$='.jpg']"); //所有带有以 ".jpg" 结尾的属性值的 href 属性
$("div#intro .head");//id="intro" 的 <div> 元素中的所有 class="head" 的元素

 

分享到:
评论

相关推荐

    jquery简介

    【jQuery 简介】 jQuery 是一款非常流行的 JavaScript 库,由 John Resig 创建,它以其简洁高效的设计理念——“WRITE LESS, DO MORE”而受到广泛赞誉。jQuery 的目标是简化 JavaScript 开发,使得开发者可以更轻松...

    jQuery基础.pptx

    1 jQuery简介 jQuery优势 jQuery安装 jQuery语法 1、jQuery简介 1.1 学习jQuery之前,需要以下基础知识 HTML CSS JavaScript 1、jQuery简介 1.2 什么是jQuery? jQuery是一个JavaScript函数库 轻量级,“写的少,做的...

    Java电商系统+Java学习资料+Java教程第21节+21jQuery简介

    Java电商系统+Java学习资料+Java教程第21节+21jQuery简介。

    jQuery简介、jQuery使用详解、DOM对象与jQuery对象的转换与区别

    首先,我们从jQuery的简介开始。jQuery是由John Resig于2006年创建的,其目标是“write less, do more”。jQuery的核心理念是提供一个简洁的API,使得开发者可以更高效地处理页面中的元素选择、事件绑定和动态效果。...

    WEB开发 之 jQuery 简介.docx

    jQuery 是一个广泛应用于 Web 开发中的 JavaScript 库,它的出现极大地简化了 JavaScript 代码的编写,使得网页交互和动态效果的实现变得更加简单高效。jQuery 的核心理念是“Write Less, Do More”,即用更少的代码...

    jquery-3.5.1.rar

    一、jQuery简介 jQuery是由John Resig创建的一个开源项目,它的目标是简化JavaScript的DOM操作、事件处理、动画设计和Ajax交互。jQuery的设计理念是"Write Less, Do More",即通过简洁的语法实现复杂的任务,提高...

    JQuery技术入门介绍_20090427

    jQuery简介 jQuery是由John Resig创建的一个JavaScript库,其主要目标是简化JavaScript的DOM操作、事件处理、动画效果和Ajax交互。通过jQuery,开发者可以以更少的代码实现更多的功能,提高开发效率。 ### 2. ...

    jquery-1.11.1.js 、jquery-1.11.1.min.js 【官方jquery包 js】

    1. **jQuery简介** jQuery是一个轻量级的JavaScript库,它极大地简化了JavaScript的DOM操作、事件处理、动画设计和Ajax交互。它的API设计易于理解和使用,使得开发者能够用更少的代码实现更多的功能,提高了开发...

    jquery1.51

    一、jQuery简介 jQuery是由John Resig创建的一个轻量级、高性能的JavaScript库,它的主要目标是简化HTML文档遍历、事件处理、动画效果和Ajax交互。jQuery 1.5.1是其历史上的一个重要版本,它在1.5的基础上进行了多项...

    jquery手册jquery的学习jquery的学习

    一、jQuery简介 jQuery是由John Resig在2006年创建的一个轻量级的JavaScript库,它的核心理念是“Write Less, Do More”。jQuery通过提供简洁的API,使得开发者能够以更少的代码实现更多的功能,降低了JavaScript...

    jquery引用文件——jquery.js

    一、jQuery简介 jQuery是由John Resig开发的开源JavaScript库,其主要目标是简化JavaScript的DOM操作,同时提供丰富的事件处理、动画效果和Ajax交互。jQuery的命名源自"JavaScript"和"Quirksmode"的组合,意在解决...

    jquery基础教程中文版2015

    一、jQuery简介 jQuery由John Resig在2006年创建,其核心理念是"Write Less, Do More"。它通过提供简洁的API,让JavaScript编程变得更加简单。jQuery支持多种浏览器,包括IE6及更高版本,以及Firefox、Chrome、...

    jquery 3.5.1

    一、jQuery简介 jQuery是由John Resig于2006年创建的,它简化了DOM操作、事件处理、动画效果和Ajax交互等任务。jQuery的核心理念是"Write Less, Do More",通过简洁的语法,让复杂的JavaScript任务变得简单易行。 ...

    [jQuery实战第二版].pdf

    - jQuery简介及其核心理念。 - 如何使用jQuery简化常见的JavaScript任务。 - jQuery选择器详解。 2. **核心功能讲解**: - DOM操作技巧,包括添加、删除和修改元素。 - CSS类操作方法。 - 动画效果和jQuery UI...

    JQuery-1.4 and JQuery-1.4.mini

    一、jQuery简介 jQuery是由John Resig在2006年创建的一个开源JavaScript库,它的目标是“Write Less, Do More”。jQuery简化了HTML文档遍历、事件处理、动画制作和Ajax交互等任务,极大地提高了前端开发效率。 二...

    jQuery图片裁剪插件jQuery-photoClip

    jQuery简介 jQuery是由John Resig在2006年创建的一个JavaScript库,其核心理念是“Write Less, Do More”。jQuery极大地简化了JavaScript的DOM操作、事件处理、动画设计和Ajax交互。它使得JavaScript编程变得更加...

    jquery-3.4.1.rar

    一、jQuery简介 jQuery是由John Resig创建的一个轻量级的JavaScript库,它的目标是简化HTML文档遍历、事件处理、动画和Ajax交互。jQuery的核心理念是"Write Less, Do More",通过提供简单易用的接口,使得复杂的DOM...

Global site tag (gtag.js) - Google Analytics