开始学习jQuery和准备工作实战列表

开始学习jQuery和准备工作

---

现在让我们开始学习最流行的JavaScript框架jQuery吧。至于JavaScript，不用担心，我们很快就会涉及到它。

在我们开始学习使用jQuery之前，需要在HTML文件中添加一些代码。

首先，在页面顶部添加一行script元素，然后在下一行写上结束符。

浏览器会运行script里所有的Javascript，包括jQuery。

在你的script元素里，添加这段代码：$(document).ready(function() { 到你的script中，然后在下一行用});结束它。

接下来我们将学习如何写function，需要注意的是，function里面的代码会在浏览器加载页面后立即运行。

这很关键，因为在没有document ready function以前，你的代码可能会在HTML渲染完成之前就执行了，这样会产生bug。

 

 

 

jQuery使用选择器获取HTML元素

---

现在，我们已经了解了document ready function。

接下来，让我们开始写第一个jQuery语句，所有jQuery方法都是以$开头，通常称为 美元符号，或者简称为bling。

jQuery通过选择器来选择一个HTML元素，然后对元素做些改变。

例如，要让所有的button元素有弹回效果，只要把这段代码写在document ready function里面就可以了：

$("button").addClass("animated bounce");

注意，我们已经在后台为你引入了jQuery库和Animate.css库，你可以在编辑器里直接使用这两个库，从而通过jQuery给button元素添加Animate.css的bounce回弹动画效果。

另外，请务必使用$("button").addClass("animated bounce");，而不是$('button').addClass("animated bounce");，因为单引号选择器无法通过我们的测试。

jQuery使用addClass()方法给元素加class

---

你已经了解我们是怎么给所有的button做弹回效果了吗？我们用$("button")来选择按钮，然后用.addClass("animated bounce")给按钮加CSS class。

你只需要用jQuery的.addClass()方法，就可以给元素加class了。

首先，让我们使用$(".well")来获取所有带有wellclass的div元素。

注意，像使用CSS声明一样，你需要在class的名称前面添加一个.

然后使用jQuery的.addClass()方法添加2个class：animated和shake。

例如，你可以将下面的代码写在document ready function里，给所有具有text-primaryclass的元素添加animated<