jQuery簡明教程
摘要：
偶爾才用用jQuery，但是老是不記得怎麼用，所以總結一下做個筆記
都9102年了，還在用jQuery？是的，有時候還是會用到jQuery：
不想做單頁應用（例如不方便SEO，除非預渲染）
只需要一些簡單的操作，並不需要MVVM
已經有jQuery依賴了，不想...
偶爾才用用jQuery，但是老是不記得怎麼用，所以總結一下做個筆記
都9102年了，還在用jQuery？是的，有時候還是會用到jQuery：
- 不想做單頁應用（例如不方便SEO，除非預渲染）
- 只需要一些簡單的操作，並不需要MVVM
- 已經有jQuery依賴了，不想再引入新的依賴
- 。。。其他
jQuery是一個JS庫，大約在2014年左右風靡一時，現在的風頭已經全都轉向了React，Angular，Vue等等MVVM的庫。
首先jQuery裡非常多的$
，$
代表的就是jQuery。我們一般會把程式碼放在這樣一個函式裡，也就是等到頁面載入完成之後，才執行程式碼，可以這樣寫：
首先我們要在頁面裡引入JS庫：
<script src="https://cdn.staticfile.org/jquery/3.4.0/jquery.min.js"></script>
然後，就可以開始執行jQuery程式碼：
$(document).ready(function() {
// blablabla
})
也可以這樣:
$(function() {
// blablabla
})
選擇器
jQuery的操作理念是，HTML在瀏覽器端會解析成一顆DOM樹。我們通過使用選擇器來選中其中一些節點，然後執行操作，也可以通過節點的一些函式例如parent
,children
,siblings
來訪問父節點，子節點和兄弟節點等等。
以下是常見的用法：
-
$("p")選中所有<p>元素 -
$("#id")選中id為id的元素 -
$(".class")選中所有class為class的元素 -
$("*")選中所有元素 -
$("[href]")選取帶有href的元素
還可以組合起來用，例如：
-
$("p.name")選中所有class為name的<p>元素 -
$("a[href='https://jiajunhuang.com']")選取所有href屬性是https://jiajunhuang.com的<a>元素
事件
事件就是一些例如 點選，鍵盤等等的事件。常見的有：
click dbclick submit resize
等等。一般是這樣使用的：
$(function() {
$("button.btn").click(function() {
alert("clicked");
});
})
AJAX
如果要是用jQuery來發送請求，就需要接觸AJAX
注意，jQuery的slim版本不支援ajax。
主要使用三個方法：
-
$.get(URL, callback)是傳送GET請求 -
$.post(URL, callback)是傳送POST請求 -
$.ajax(URL, [settings])這個就比較複雜，具體需要查文件：http://api.jquery.com/jquery.ajax/
舉個例子，如果需要點選某個按鈕，然後就聚焦到回覆框，那麼就需要這樣寫：
<script>
$(function() {
$(".reply_img").click(function() {
var nickname = $(this).siblings("a.nickname").html();
$("#reply_box").append("@" + nickname + " ");
$("#reply_box").focus();
})
})
</script>