Javascript和Jquery语法对比总结

目的

相信大家都知道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