FCC-Front End Development jQuery

知識點：

1. jQuery隻是用JavaScript寫的一個庫。
2. 下面這個documet ready function實在網頁被加載完成之後才會開始工作的。

   $(document).ready(function() {
    });
              

3. Now let’s write our first jQuery statement. All jQuery functions start with a $, usually referred to as a dollar sign operator, or as bling.jQuery often selects an HTML element with a selector, then does something to that element.For example, let’s make all of your button elements bounce. Just add this code inside your document ready function:

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

   注意标簽名要用雙引号包括起來，addClass就是給所有的button加上一個額外的類。

4. $(".well").addClass("animated shake");

   是給well類加動畫效果，well前面有一個英文句号哦！而且所有的都用雙引号！

5. $("#target3").addClass("animated fadeout");

   是給id為target3的元素加動畫效果。
6. 有addClass當然也會有removeClass辣！使用方法目前看來是一緻的。
7. jQuery has a function called .css() that allows you to change the CSS of an element.Here’s how we would change its color to blue:

   $("#target1").css("color", "blue");

   . The CSS property and its value are in quotes, and separated with a comma instead of a colon.
8. jQuery has a function called .prop() that allows you to adjust the properties of elements.Here’s how you would disable all buttons:

   $("button").prop("disabled", true);

   .
9. jQuery function:text(), that only alters text without adding tags. jQuery has a function called .html() that lets you add HTML tags and text within an element. Any content previously within the element will be completely replaced with the content you provide using this function, for example:

   $("#target4").html("<em>#target4</em>");
   $("#target2").text("hi");
              

10. jQuery has a function called .remove() that will remove an HTML element entirely .
11. jQuery has a function called appendTo() that allows you to select HTML elements and append them to another element.
12. jQuery has a function called clone() that makes a copy of an element.For example, if we wanted to copy not replace “target2” to “#right-well”, we would use:

    $("#target2").clone().appendTo("#right-well");

    This is called function chaining and it’s a convenient way to get things done with jQuery.
13. jQuery has a function called parent() that allows you to access the parent of whichever element you’ve selected.
14. jQuery has a function called children() that allows you to access the children of whichever element you’ve selected.
15. jQuery uses CSS Selectors to target elements. target:nth-child(n) css selector allows you to select all the nth elements with the target class or element type.Here’s how you would give the third element in each well the bounce class:

    $(".target:nth-child(3)").addClass("animated bounce");

16. Another CSS selector: odd or even.

    $(".target:odd").addClass("animated shake");