JQuery與js具體使用的區別（不全，初學）

標籤：c   style   class   java   a   ext   

jQuery能大大簡化Javascript程式的編寫

    要使用jQuery，首先要在HTML代碼最前面加上對jQuery庫的引用，比如：

    <script language="javascript" src="/js/jquery.min.js"></script>

    庫檔案既可以放在本地，也可以直接使用知名公司的CDN，好處是這些大公司的CDN比較流行，使用者訪問你網站之前很可能在訪問別的網站時已經緩衝在瀏覽器中了，所以能加快網站的開啟速度。另外一個好處是顯而易見的，節省了網站的流量頻寬。

jQuery代碼具體的寫法和原生的Javascript寫法在執行常見操作時的區別如下：

1 定位元素  JS  document.getElementById("abc") 
     jQuery  $("#abc") 通過id定位  $(".abc") 通過class定位  $("div") 通過標籤定位 
     需要注意的是JS返回的結果是這個元素，jQuery返回的結果是一個JS的對象。以下例子中假設已經定位了元素abc。 
2 改變元素的內容 

     JS  abc.innerHTML = "test";  jQuery  abc.html("test"); 
3 顯示隱藏元素 

    JS  abc.style.display = "none";  abc.style.display = "block"; 
    jQuery  abc.hide();  abc.show();

    abc.toggle();  //在顯示和隱藏之間切換
4 獲得焦點 
    JS和jQuery是一樣的，都是abc.focus(); 
5 為表單賦值 

    JS  abc.value = "test";  jQuery  abc.val("test"); 
6 獲得表單的值 

    JS  alert(abc.value);  jQuery  alert(abc.val()); 
7 設定元素不可用 

    JS  abc.disabled = true;  jQuery  abc.attr("disabled", true);

8 修改元素樣式

    JS abc.style.fontSize=size; jQuery abc.css(‘font-size‘, 20);

    JS abc.className="test"; JQuery abc.removeClass();  abc.addClass("test");

9 Ajax

      JS 自己建立對象，自己處理瀏覽器安全色等亂七八糟的問題，略去不表

      jQuery $.get("abc.php?a=1&b=2", recall);

      postvalue = "a=b&c=d&abc=123";

      $.post("abc.php", postvalue, recall);

      function recall(result) { alert(result); //如果返回的是json，則如下處理

      //result = eval(‘(‘ + result + ‘)‘); 

      //alert(result); }

10 判斷複選框是否選中

      jQuery if(abc.attr("checked") == "checked")

     注意：網上說的.attr("checked") == true實際上不能用，上面這個測試過能用