想必做前端的童鞋在开发生涯中对jquery恐怕再熟悉不过了！jquery是比较成熟的前端开发框架，刚踏进前端生涯的童鞋可能接触的第一个框架也是jquery了吧！确实，在最近项目比较赶的情况下，jquery确实帮了我很大的忙，使我快速完成了项目开发，并且控制台报错率很低、兼容性挺好以及代码量相对于原生js较少的多！
如此好的的开发框架，但我先前一直对它视而不见，什么原因导致我对jquery一直很低调的的态度呢！我也总结了一下几点原因：
1、个人原因！我一直不喜欢用别人的东西，使用jquery无论写出多牛逼的页面，我总感觉我有种抄袭别人的感觉在里面，————我一直是这样的人，就好像读书那时期末考试，有题我不会，即便别人给我答案抄，我也会不屑于去抄答案，我宁愿交白卷，这多少说明我有点自负吧！所以这是我一直不想用jquery等框架的最主要原因。当然了还有层装逼的意思在里面，因为我觉得只会用jquery等框架，其实算不上你会javascript了,只能说你会套用某框架而已！
2、jquery再厉害也是javascript写的！这一点原因我觉得我的想法还是超前的，（哈哈，原谅我如此直白的装逼）！你会发现一个问题，同样的需求，如果一直用js写代码的人，他照样能用jquery写，即便他之前没有接触过jquery，但稍微看一下jqueryAPI就能很快写出来，但相反一直用jquery写代码的人，却不会用js写，至少来说是需要花很多时间去再学习js的。也可以这样说，会js的人，照样会jquery，但会jquery的人，不一定会js，至少不会很深，我曾经看到一个和我共事的同事，一直在用jquery写代码，但有时候项目需求变了，或者说他要实现的那个逻辑没有在jquery找到对应的api，他就会陷入困境，其实稍微用js就可以写出来了！这也是我一直以来对自己要求坚持用js写代码的原因。首先，js是你的基础，就好像人应该先学习爬，再学习走！学好js肯定对你接下来学一下框架是有帮助的！就好像，我一直坚持刚开始学习的时候不使用driverweaver,因为它自动给你补全了一些本来该你手写的内容，从而导致你对这一块的内容的学习、熟悉过程！其次，用js写代码，逻辑比较清楚，长期下去，你就会对页面的一些实现逻辑理解的更透彻。最后，一些简单的页面，完全没有别要引用jquery，直接js写就好了！
3、思维的固化，使用jquery固然没错，但是我觉得会形成某种固定的思维模式，稍微变一下需求，你就会犯愁！就想前面我的同事的案例一样！
上面三点是我坚持不喜用js的原因，ok，虽然我对jquery有这么大的“成见”，可是我还是要向大家推荐这个很牛逼的框架。可以这样说，一般的项目需求，完全可以利用jquery来写，那好，说完我不愿意使用jquery的原因，我同样说下用jquery的原因，同样，我总结了一下，理出几点原因：
1、代码量！这是大家公认使用jquery的原因，也是jquery这款框架最初给开发者发出的号召：“写的更少，做得更多”，废话不多说，先来举一个用js和jquer分别写选项卡的例子。可复制代码测试。首先给出html代码：
<ul id="nav">
<li class="active">选项一</li>
<li>选项二</li>
<li>选项三</li>
</ul>
<div class="optionParent">
<div class="optionChild" style="display:block;">内容一</div>
<div class="optionChild">内容二</div>
<div class="optionChild">内容三</div>
</div>
<style type="text/css">
div,ul,li{
margin:0px;
padding:0px;
text-align:center;
}
ul{
width:300px;
display:block;
list-style:none;
margin:0px auto;
margin-top:50px;
}
ul:after{
display:block;
height:0px;
clear:both;
visibility:hidden;
overflow:hidden;
content:'';
}
li{
float:left;
width:100px;
font:14px "microsoft yahei";
line-height:30px;
background-color:#ddd;
color:#333;
cursor:pointer;
}
li:hover{
background-color:#c00;
color:#fff;
}
li.active{
background-color:#c00;
color:#fff;
}
div{
width:300px;
margin:0px auto;
}
.optionChild{
margin-top:8px;
display:none;
}
</style>
<script type="text/javascript">
window.onload = function(){
//得到ul
var nav = document.getElementById('nav');
if(!nav)return;
//得到选项卡清单
var oLi = nav.getElementsByTagName('li');
//得到切换内容清单
var oWrap = document.getElementsByClassName('optionChild');
for(var i = 0,len = oLi.length;i < len;i++){
(function(n){
oLi[n].onclick = function(){
for(var j = 0,len1 = oLi.length;j < len1;j++){
oLi[j].className = '';
oWrap[j].style.display = 'none';
};
this.className = 'active';
oWrap[n].style.display = 'block';
};
})(i);
};
};
</script>
<script type="text/javascript">
$(function(){
$("#nav li").click(function(){
$(this).addClass('active').siblings().removeClass("active");
//得到当前选项的索引
var $_index = $("#nav li").index($(this));
$(".optionChild").css('display','none').eq($_index).css('display','block');
});
});
</script>
分别查看上面的js代码和jquery代码，很明显，jquery代码是很少的，而js代码却很多，并且很复杂！特别注意，jquery的链式代码风格很强大，有时一个需求，仅用一句代码就能搞定！
2、出错情况！一般我们用js写的代码需要考虑很多出错情况的下的逻辑，比如在A页面的a.js里面写了如下的代码：
var dom = document.getElementById("myDom");
dom.onclick = function(){
//代码省略
}
我如果现在B页面需要用到上面的a.js，那么控制台会报错，因为在B页面是没有id为myDom的节点的，而我们如果使用jquery，就不会出现下面的情况，一般情况下，js找不到对应的节点并且没有做出错处理、判断等那么控制台会报错，而jquery会静默的处理代码错误，从而不会报错！从这里可以知道，jquery减少了你在写代码的过程中因为查找不存在节点的所引发的错误！
3、兼容性！这一点是类似的一些框架的共性了，它们在设计之初就已经兼容性问题进行了有效的处理，从而减少你用js写时需要多增加很多浏览器能力检测的代码！比如，下面的代码是js阻止冒泡的代码：
而在jquery中，你只要在事件放生时，使用下面一句代码就能搞定阻止冒泡：
4、可扩展性！你完全可以在jquery的基础上封装自己的个性插件，兼容性等保留jquery的特点！
如果你会用jquery，你会发现写代码是一件很轻松的事情，这都得益于jquery写代码量少、出错低、兼容性好等特点！