1、jQuery是一个快速，小巧，功能丰富的JavaScript库。jQuery 使HTML文档遍历和操作，事件处理和动画等操作变得更加简单。

 

　　jQuery的代码将在所有主流浏览器中运行完全相同，包括Internet Explorer 6！

 

　　2、可以从下载jQuery库的副本，或者从CDN（内容分发网络）（如BootCDN或百度CDN）中引入。 将使用BootCDN上的CDN。要开始使用jQuery，首先需要使用script标签将其添加到我们的HTML文档的头部。

 

　　在使用HTML文档之前等待HTML文档完全加载并准备就绪是一种很好的做法。为此，我们使用 document（文档） 对象的ready事件：

 

　　$ 用于访问jQuery。 从这里开始，代码访问document对象，并定义了当 document 的 ready 事件触发时要调用的函数。 这样可以防止任何jQuery代码在文档加载完成之前运行。我们有一个方便的快捷方式， 等价于上面的代码：

 

　　3、现在，在我们head部分中引入了jQuery库，并且已经定义了文档就绪事件，我们可以开始我们的第一个jQuery操作！ 让我们改变div元素的内容。

 

　　以上代码， 在页面文档准备就绪后将 id="start" 的元素的HTML更改为"出发吧，骚年！"。

 

　　4、jQuery用于选择（查找）HTML元素并对其执行"操作"。

 

　　selector 是选择器， 用于查找HTML元素。action 是要元素要执行的动作。

 

　　jQuery使用CSS选择器语法来选择元素。

 

　　5、选择

 

　　jQuery选择器以美元符号和圆括号开头：$（）。注意： jQuery中所有的符号都是英文符号。最基本的选择器是元素选择器，它根据元素名称选择所有元素。

 

　　接下来是id和类选择器，它们通过id和类名来选择元素：

 

　　还可以对选择器使用以下语法：

 

　　选择器比纯JavaScript更容易访问HTML DOM元素。

 

　　6、常用选择器

 

　　7、可以通过jQuery轻松的操作分配给HTML元素的属性。比如元素的 href,src,id,class,style 属性。attr（）方法用于获取属性的值。

 

　　attr（） 方法还允许我们通过第二个参数来给属性设置一个值。

 

　　8、删除属性

 

　　你还可以从HTML元素中删除属性。removeAttr（） 方法用于删除元素的任何属性。

 

　　9、可以通过jQuery操作HTML元素的内容。html（） 方法用于获取所选元素的内容，包括HTML标记。

 

　　请注意，HTML标签<b>也被返回。如果你只需要文本内容，不需要HTML标签，可以使用 text（） 方法：

 

　　html（） 和 text（） 方法可以用于包含内容的所有HTML元素。

 

　　设置内容-可以使用html（）和text（）方法来更改HTML元素的内容。

 

　　上面的代码将 id="test" 的元素的内容更改为"hello!"。

 

　　如果你设置的内容包含HTML标记，则应使用 html（） 方法而不是 text（）。

 

　　10、val（）方法

 

　　val方法允许我们获取和设置表单字段的值，例如： 文本框（input），下拉列表（select） 等。

 

　　类似地，你可以在val（）方法传入参数来设置该字段的值。当需要处理表单事件和验证时，获取和设置表单域的值非常有用。

 

　　11、总结如下：

 

　　12、添加内容

 

　　jQuery具有用于向所选元素添加新内容而不删除现有内容的方法：

 

　　还可以插入带有HTML标签的内容。

 

　　13、使用jQuery创建新HTML元素的最简单方法如下：

 

　　上面的代码创建一个新的<p>元素，其中包含文本Hi，并将其分配给一个名为txt的变量。

 

　　可以将该变量作为上述方法的参数添加到我们的HTML中

 

　　这将在#demo段落之后插入新创建的<p>元素。也可以通过使用逗号分隔来指定多个元素作为 before（），after（），append（），prepend（）方法的参数例如：$（"#demo"）。append（var1,var2,var3）。

 

　　上面提到的用于创建元素的语法可以用来创建任何新的HTML元素，例如$（"<div></div>"）可以创建一个新的div。

 

　　14、添加CSS

 

　　addClass（）方法为选定的元素添加一个或多个类。

 

　　要在 addClass（） 方法中指定多个类， 只需使用空格分隔它们。 例如$（"div"）。addClass（"class1 class2 class3"）。