jquery可以說是js的封裝，大多數情況下jquery比js簡單，它們兩個可以相互寫對方的里面，使用jquery需要導入jquery文件。
<script src="jquery-1.1.min.js"></script>
jquery文件名格式為，jquery-版本號[.min] .js 其中min表示壓縮版
jquery與js相似，所以他們的操作基本一一對應，只是方式不同：
主要操作有：
找對象：通過id、name、className、TagName找對象
操作對象：操作屬性：取值，賦值，刪除
操作樣式：獲取樣式，設置樣式
操作內容：
表單元素：獲取內容，添加內容
非表單元素：獲取內容，添加內容
操作元素：添加子元素、刪除元素
添加事件：添加綁定事件、解除綁定事件
一一對應：
HTML頁面
<div id="one"><span>one</span></div>
<div class="test" bs="aa">two</div>
<div class="test">three</div>
<div class="test">four</div>
<input type="text" name="uid" bs="aa" id="uid" />
<input type="button" id="btn" value="取消綁定" />
<input type="button" id="add" value="綁定事件" />
Jquery代碼：都寫在script里面
<script type = "text/javascript">
//$在jquery中專門用來做選擇，相當於選擇器，括號里面是根據什么來選，后面點事件
//這里的意思是說，給當前頁面加了一個事件是加載完成，就是當前頁面加載完成后執行里面的function（匿名函數）
$(document).ready(function(e){
//Jquery與js找對象
//JS通過id、name、className、TagName找對象
var a = document.getElementById("one"); //id
var b = document.getElementsByClassName("test");//classname
var d = document.getElementsByTagName("div"); //tagname
var c = document.getElementsByName("uid"); //name
//JQUERY通過id、name、className、TagName找對象
var aj = $("#one"); //id
var bj = $(".test"); //classname
var cj = $("div"); //tagname
var dj = $("[name='uid']"); //name注意中括號，特別注意屬性可以自己定義例如：bb="aa"
var ej = $("div.test"); //div中class為test的元素，Jquery可以使用選擇器找對象。。。
==========================================================================
//Jquery與js操作對象
==========================================================================
//JS操作屬性：
a.setAttribute("",""); //設置屬性，修改屬性
a.remove(""); //移除屬性
a.getAttribute(""); //獲取屬性
//JQUERY操作屬性
aj.attr("",""); //設置屬性，修改屬性
aj.removeAttr(""); //移除屬性
aj.attr(""); //獲取屬性
==========================================================================
//JS操作內容
a.innerText; //非表單元素的取值，賦值是：a.innerText = "aaaa";
a.innerHTML; //非表單元素的取值，賦值是：a.innerHTML = "<a>123</a>"; 可以解析html標簽
a.value; //表單元素的取值，賦值是：a.value = "aaaa";
//JQUERY操作內容
aj.text(); //非表單元素的取值，賦值是：aj.text("aaaa");
aj.html(); //非標單元素的取值，賦值是：aj.html("<a>123</a>"); 可以解析html標簽
aj.val(); //標簽元素的取值，賦值是：aj.val("aaaa");
==========================================================================
//JS操作樣式
a.style.backgroundColor = red; //設置樣式
a.style.color; //獲取樣式，只能獲取內聯樣式，也就是寫在標簽里面的樣式
//JQUERY操作樣式
aj.css("color","yellow"); //設置樣式
aj.css("color"); //可以獲取到內嵌式的樣式屬性
==========================================================================
//JS操作元素，創建元素兩種方式
//第一種用html賦值來創建元素
var s = "<input type='button' value='"+i+"' class='bbb' onclick='doselect(this)'>"
var dd = document.getElementById("test");
dd.innerHTML += s;
//第二種是使用createElement
var ab = document.createElement("input");
ab.setAttribute("type","button");
ab.setAttribute("value",i);
ab.setAttribute("class","bbb");
ab.setAttribute("onclick","doselect(this)");
var dd = document.getElementById("test");
dd.appendChild(ab);
//刪除元素
var dd = document.getElementById("test");
dd.remove;
//JQUERY操作元素,創建元素
var str = "<div id='a' style='width:100px; height:100px; background-color:red'></div>";
div.append(str);
//刪除元素
$("#a").remove();
==========================================================================
//JQUERY中的事件
$(".test").click(function(){
alert($(this).text());
});
$(".test").bind("click",function(){ //綁定事件，注意可以同時綁定多個
alert($(this).text());
});
$("#btn").click(function(){
$(".test").unbind("click"); //解除綁定事件
});
$("#add").click(function(){
$(".test").bind("click",function(){
alert($(this).text());
});
});
});
</script>