目的

相信大家都知道jq是js的一個類庫,是為了方便我們開發前端，但是筆者在剛開始學習js和jq時經常將兩者的語法記混和混用，所以整理下兩者實現相同功能之前的語法區別。

宣告變數

javascript宣告變數

語法 var + 變數名 =值；或者 let + 標量名=值；ES6新增了let命令，用於宣告變數。其用法類似於var(全域性變數)，但是所宣告的變數只在let命令所在的程式碼塊內有效。例如：for迴圈的計數器就很適合使用let命令。

var  name = Kingfan; //var 表示全域性變數

var list = [1,2,3,4]   //宣告一個數組

for(let i=0;i<list.lenght;i++) // i只在for迴圈的時候在用到，所以沒必要宣告一個全域性變數，所以用let宣告
{
    console.log(list[i])
}
 

Jquery宣告變數

jq並沒有對宣告變數進行封裝，與js宣告標量的方法完全一致。

查詢標籤

查詢標籤的本質就是選擇器和篩選器，在jq中對原生js的語法進行了很多優化和簡寫，所有有明顯的不同但也相似，所以小心記混！！！，另外js物件只能用js的語法和方法，同理jq物件也是！。

基本查詢

//通過標籤id查詢假設id=id1
document.getElementById('id1')        //js根據ID獲取一個標籤返回js物件是具體的單個標籤
$('#id1')        //jq根據ID獲取一個標籤 返回JQ物件，是一個類似列表的資料型別$('#id1')[0]        可以取值得到js物件

//通過class屬性查詢，假設class=c1
doucument.getElementsByClassName('c1')       //js根據class查詢，注意返回的是多個值按索引取值
$('.c1')    //jq查詢，內部語法類似css原生選擇器

//根據標籤名獲取標籤合集例如div標籤
document.getElementsByTagName('div')    //js
$('div')            //jq