jQuery基础学习(一)—jQuery初识

一、jQuery概述

1.jQuery的优点

jQuery是一个优秀的JavaScript库，极大地简化了遍历HTML文档、操作DOM、处理事件、执行动画和开发Ajax的操作。它有以下几点优势。

(1)轻量级。

(2)强大的选择器。

(3)出色的DOM封装。

(4)可靠的事件处理机制。

(5)完善的Ajax。

2.jQuery类库说明

jQuery的库分为两种，分别是生产版和开发版。区别如下:

名称	大小	说明
jquery.js(开发版)	约229KB	完整无压缩，主要用于测试、学习、开发。
jquery.min.js(生产版)	约31KB	经过工具压缩主要用于产品和项目。

3.第一个HelloWorld

使用jQuery库之前先引入这个库。

    <!-- 导入jQuery库 -->
    <script type="text/javascript" src="jquery-2.2.3.js"></script>

时间： 2024-10-09 23:16:53

jQuery基础学习(一)—jQuery初识的相关文章

jQuery基础学习3——jQuery库冲突

默认情况下,jQuery用$作为自身的快捷方式. jQuery库在其他库之后导入在其他库和jQuery库都被加载完毕后,可以在任何时候调用jQuery.noConflict()函数来将变量$的控制权移交给其他JavaScript库. 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.d

jQuery基础学习(二)—jQuery选择器

一.jQuery基本选择器 1.CSS选择器在学习jQuery选择器之前,先介绍一下之前学过的CSS选择器. 选择器语法描述示例标签选择器 E { CSS规则 } 以文档元素为选择符 ID选择器 #ID{ CSS规则 } 以ID为选择符类选择器 E.className{ CSS规则 } 以文档元素的Class为选择符群组选择器 E1,E2{

jQuery基础学习4——jQuery容错性

使用jQuery选择器不仅比使用传统的getElementById()和getElementsByTagName()函数简洁得多,而且还能避免某些错误. 1 <script type="text/javascript"> 2 document.getElementById("tt").style.color="red"; 3 </script> 如果网页中没有id为“tt”的元素,浏览器就会报错. 1 <script

jQuery基础学习(三)—jQuery中的DOM操作

一.查找节点查找属性节点: 通过jQuery的选择器来完成. 操作属性节点: 调用jQuery对象的attr()来获取它的属性值. 操作文本节点: 通过text()方法. //1.操作文本节点:通过jQuery的text()方法 alert($("#bj").text()); $("#bj").text("南京"); alert($("#bj").text()); //2.操作属性节点 //注:

【jQuery基础学习】09 jQuery与前端（这章很水）

这章主要是将如何将jQuery应用到网站中,或者说其实就是一些前端知识,对于我这种后端程序来说其实还是蛮有用的. 关于网站结构文件结构前端文件分三个文件夹放 images文件夹用来存放将要用到的图片 styles文件夹用来存放css样式表 scripts文件夹用来存放js脚本网页结构头部:网站的品牌log,登录信息内容:放置网站的主体内容尾部:放置网站的其它友情链接和版权信息之类的关于网站样式首先写一个样式表,来包含全局的样式.定义整个网站的reset.css样式表,编写一些全局

jQuery基础学习

1.广受欢迎的 JavaScript 框架: jQuery Prototype MooTools 这些框架都提供针对常见 JavaScript 任务的函数,包括动画.DOM 操作以及 Ajax 处理 2.jQuery 使用 CSS 选择器(即html元素)来访问和操作网页上的 HTML 元素(DOM 对象). 3.jQuery 是一个 JavaScript 函数库. jQuery 库包含以下特性: HTML 元素选取 HTML 元素操作 CSS 操作 HTML 事件函数 JavaScript 特

【总结整理】JQuery基础学习---动画

jQuery中隐藏元素的hide方法让页面上的元素不可见,一般可以通过设置css的display为none属性.但是通过css直接修改是静态的布局,如果在代码执行的时候,一般是通过js控制元素的style属性,这里jQuery提供了一个快捷的方法.hide()来达到这个效果 $elem.hide() 提供参数: .hide( options ) 当提供hide方法一个参数时,.hide()就会成为一个动画方法..hide()方法将会匹配元素的宽度,高度,以及不透明度,同时进行动画操作快捷参数

jQuery基础学习1

标准HTML文件引入jQuery库方法: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <meta http-equiv="Content-Type" content="t

jQuery基础学习2——DOM和jQuery对象

1 <body> 2 <h3>例子</h3> 3 <p title="选择你最喜欢的水果." >你最喜欢的水果是?</p> 4 <ul> 5 <li id="apple">苹果</li> 6 <li>橘子</li> 7 <li>菠萝</li> 8 </ul> 9 </body> 可以通过JavaScr