完全没有否定jQuery的意思，jQuery是一个神奇的、非常有用的工具，可以节省我们大量的时间。
但是，有些时候，我们只需要jQuery的一个小功能，来完成一个小任务，完全没有必要加载整个jQuery程序库。下面是一些用简单JavaScript实现jQuery功能特征的代码汇总。当然，这个汇总并不完全，你最好还是看一下《》
查找搜索(选择器)
按ID查找:
$('#foo')document.getElementById('foo') 按class名搜索:
$('.bar')document.getElementsByClassName('bar') 按标记名搜索:
$('span')document.getElementsByTagName('span') 按子元素搜索:
$('#foo span')document.getElementById('foo').getElementsByTagName('span') 搜索特殊元素:
$('html')document.documentElement$('head')document.head$('body')document.body 元素属性操作
获取/设置HTML:
$('#foo').html()document.getElementById('foo').innerHTML$('#foo').html('Hello, world!')document.getElementById('foo').innerHTML = 'Hello, world!' 添加/删除/搜索判断class:
$('#foo').addClass('bar')document.getElementById('foo').className += ' bar '$('#foo').removeClass('bar')document.getElementById('foo').className = document.getElementById('foo').className.replace(/\bbar\b/gi, '')$('#foo').hasClass('bar')document.getElementById('foo').className.search(/\bbar\b/gi) !== -1 元素值:
$('#foo').val()document.getElementById('foo').value
特效
隐藏/显示操作:
$('#foo').show()document.getElementById('foo').style.display = ''$('#foo').hide()document.getElementById('foo').style.display = 'none' 修改CSS样式:
$('#foo').css('background-color', 'red')document.getElementById('foo').style.backgroundColor = 'red'
事件
页面加载完成(ready)
在jQuery里，我们最常使用的是$(document).ready。对于它，下面是替换方法：
document.onreadystatechange = function() { if (document.readyState === 'complete') { // DOM is ready! }};
点击事件
$('#foo').click(function() { ... })document.getElementById('foo').onclick = function() { ... }
AJAX
新版的JavaScript API里提供了一个全新的可以实现ajax的API——，这个api采用了全新的 架构，使用起来更方便，更灵活，详细用法请参考《》。
工具类技术
分析JSON:
jQuery.parseJSON(json)JSON.parse(json)
总结
从上面的代码，我们可以看出，jQuery里的很多功能都可以用很多简单的JavaScript代码实现。jQuery虽然很好用，但它有体积的负担，如果遇到一个问题，你可以用简单的代码实现，而不用去加载jQuery，这岂不是更高效，更实用的方法吗