什么不用jQuery？因为它让你的网站体积变得臃肿。你的网站并不真的需要jQuery，不需要它带来的额外体积、带宽和加载时间。

用原生JavaScript简单实现jQuery提供的功能和方法

查找、选择页面元素

// jQuery 实现var els = $('.el');// 原生JavaScript实现var els = document.querySelectorAll('.el');// 简写var $ = function (el) {  return document.querySelectorAll(el);}var els = $('.el');

　　创建元素

// jQuery 实现var newEl = $('
     
');// 原生JavaScript实现var newEl = document.createElement('div');

　　事件、监听器操作

// jQuery 实现$('.el').on('event', function() {});// 原生JavaScript实现[].forEach.call(document.querySelectorAll('.el'), function (el) {  el.addEventListener('event', function() {  }, false);});

　　设置、修改和获取属性值

// jQuery 实现$('.el').filter(':first').attr('key', 'value');$('.el').filter(':first').attr('key');// 原生JavaScript实现document.querySelector('.el').setAttribute('key', 'value');document.querySelector('.el').getAttribute('key');

　　增加/修改/删除/反转 类操作

// jQuery 实现$('.el').addClass('class');$('.el').removeClass('class');$('.el').toggleClass('class');// 原生JavaScript实现document.querySelector('.el').classList.add('class');document.querySelector('.el').classList.remove('class');document.querySelector('.el').classList.toggle('class');

　　追加元素 Append

// jQuery 实现$('.el').append($('
     
'));// 原生JavaScript实现document.querySelector('.el').appendChild(document.createElement('div'));

　　复制、克隆元素

// jQuery 实现var clonedEl = $('.el').clone();// 原生JavaScript实现var clonedEl = document.querySelector('.el').cloneNode(true);

　　删除元素

// jQuery 实现$('.el').remove();// 原生JavaScript实现remove('.el');function remove(el) {  var toRemove = document.querySelector(el);  toRemove.parentNode.removeChild(toRemove);}

　　父元素操作

// jQuery 实现$('.el').parent();// 原生JavaScript实现document.querySelector('.el').parentNode;

　　前一个/下一个/临近同辈元素

/ jQuery 实现$('.el').prev();$('.el').next();// 原生JavaScript实现document.querySelector('.el').previousElementSibling;document.querySelector('.el').nextElementSibling;

　　

XHR aka AJAX

新版的JavaScript API里提供了一个全新的可以实现ajax的API——，这个api采用了全新的  架构，使用起来更方便，更灵活，详细用法请参考《》。

下面是传统的实现方式：

// jQuery 实现$.get('url', function (data) {});$.post('url', {data: data}, function (data) {});// 原生JavaScript实现// getvar xhr = new XMLHttpRequest();xhr.open('GET', url);xhr.onreadystatechange = function (data) {}xhr.send();// postvar xhr = new XMLHttpRequest()xhr.open('POST', url);xhr.onreadystatechange = function (data) {}xhr.send({data: data});

　　不可否认，jQuery有时候是开发项目时必不可少的，但不同的项目，不同的场景，项目的技术架构，都需要做不同的考量，经过冷静的思考，我们就会发现，很多时候，我并不需要jQuery，使用原生JavaScript技术反而项目变得更精简、效率更高。