jQuery和JavaScript的區(qū)別是什么？針對這個問題，今天小編總結(jié)了這篇文章，希望能幫助更多想解決這個問題的朋友找到更加簡單易行的辦法。

創(chuàng)新互聯(lián)公司從2013年成立，公司以成都網(wǎng)站制作、網(wǎng)站設(shè)計、系統(tǒng)開發(fā)、網(wǎng)絡(luò)推廣、文化傳媒、企業(yè)宣傳、平面廣告設(shè)計等為主要業(yè)務(wù)，適用行業(yè)近百種。服務(wù)企業(yè)客戶千余家，涉及國內(nèi)多個省份客戶。擁有多年網(wǎng)站建設(shè)開發(fā)經(jīng)驗。為企業(yè)提供專業(yè)的網(wǎng)站建設(shè)、創(chuàng)意設(shè)計、宣傳推廣等服務(wù)。 通過專業(yè)的設(shè)計、獨特的風(fēng)格，為不同客戶提供各種風(fēng)格的特色服務(wù)。

JavaScript：是瀏覽器中一種常見的腳本語言,以此來實現(xiàn)網(wǎng)頁的動態(tài)以及和后端（數(shù)據(jù)庫）的交互。
jQuery：是JavaScript整合后的類庫，通過操作jQuery可以減少原生JavaScript語句的使用，從而提高效率。

區(qū)別概要：
1.JQuery極大的簡化了JavaScript，最大程度上做到了以最少代碼完成更多功能的艱巨任務(wù)。
2.JavaScript對DOM的加載只加載一次，JQuery會加載多次。
3.JQuery對DOM的操作更加方便。如節(jié)點的獲取。Eg：$()

說明：提升對原生JavaScript和封裝后的JQuery兩者理解最直接的方式就是在頁面中不引入JQuery來實現(xiàn)前后端的基礎(chǔ)交互。

以下內(nèi)容是為了區(qū)別理解jQuery與JS所整理的紀要：

jQuery-和原生Javascript寫法：

1 定位元素

JS：

document.getElementById("abc")

jQuery ：

$("#abc") 通過id定位 
$(".abc") 通過class定位 
$("p") 通過標簽定位

注意：JS返回的結(jié)果是這個元素，jQuery返回的結(jié)果是一個JS的對象。以下例子中假設(shè)已經(jīng)定位了元素abc。

2 改變元素的內(nèi)容

JS：

abc.innerHTML = "test";                //現(xiàn)在的項目中有用到

jQuery：

abc.html("test");

3 顯示隱藏元素
JS：

abc.style.display = "none";              //現(xiàn)在的項目中有用到
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 設(shè)置元素不可用
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 判斷復(fù)選框是否選中
jQuery

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

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

JS和JQUERY的區(qū)別

1. 根據(jù)ID取元素
JS:取到的是一個DOM對象。
例：

var p = document.getElementByID("one");

JQUERY:取到的是一個JQUERY對象。
例：

var p = $("#one");

2. 根據(jù)class取元素[在數(shù)組里面如果要取DOM對象使用索引的方式，如果要取JQUERY對象使用eq()]
JS:取到的是一個數(shù)組
例：

var p = document.ElementsByClassName("test");

JQUERY:
例：

var p = $(".test");

3. 根據(jù)name取元素
JS：返回的是一個數(shù)組
例：

var bd = document.getElementsByName(uid);

JQUERY：的方式是用 方括號，屬性=一個值，不限制非要根據(jù)name來取值，JQUERY是根據(jù)屬性來取元素
例：

$("[name='uid']");

4. 根據(jù)標簽名取元素
JS：返回的也是一個數(shù)組
例：

var p = document.getElementsByTagName("p");

JQUERY：和樣式表里面給所有p加樣式的方法一樣，在雙引號內(nèi)直接寫標簽名
例：

$("p");

Eg:指定子目錄元素對象獲?。簐ar p = $("p span");——有很多組合方式

操作內(nèi)容

1. 非表單元素（如果是文本就用text方法，如果是html代碼就用html方法）

例：
1.1. 無參數(shù)的情況下是取值
p.text();
p.html();
1.2. 有參數(shù)的情況下是賦值
p.text("aaaa");
p.html("aaaa");
2. 表單元素
JS：
2.1. 取值
p.value;
2.2. 賦值
p.value = 'xxx';
JUQERY：
2.3. 取值
p.val();
3.4. 賦值
p.val('xxx');

操作屬性

JS操作屬性

設(shè)置|修改屬性：

p.setAttribute("","");

刪除屬性

p.removeAttribute("");

獲取屬性

p.getAttribute();

JQUERY里面用來操作屬性的方法
添加屬性：

p.attr("width","20%");

移除屬性：

p.removeAttr("width");

獲取屬性：

p.attr("width");

操作樣式
JS操作樣式-關(guān)鍵字是[style]
例：

p.style.backgroundColor = "red";

JQUERY里面操作樣式的關(guān)鍵字是css
例：

p.css("background-color","yellow");

——把這個p的背景色變?yōu)辄S色，在這里CSS里面所有的樣式和css樣式表里面的樣式是一模一樣的沒有任何變化
JS操作樣式的方法只能獲取內(nèi)聯(lián)樣式，不能取內(nèi)嵌的和外部的
JQUERY操作樣式的方法可以是內(nèi)聯(lián)的也可以是內(nèi)嵌的

關(guān)于jQuery和JavaScript的區(qū)別就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，可以學(xué)到更多知識。如果覺得文章不錯，可以把它分享出去讓更多的人看到。