先引用再使用
<script type="text/javascript" src="js/jquery1.11.3.min.js">
</script>
<script type="text/javascript">
$(document).ready(function(){
alert("hello");
})
</script>
jquery中的ready方法早於javascript中的onload方法執行，因爲onload一定會等到文檔中引用的所有資源加載完畢纔會執行，包括引用的外部css、js文件。
ready可以有多個
onload只能有一個
簡寫：
$(function(){
alert("hello");
})
javascript與jquery 事件語法不同
javascript：
domobject.事件=function(){}
jquery：
jqueryobject.事件(function(){});
javascript與jquery 的屬性不通用
特徵：
1.豐富選擇器
javascript：
var div=document.getElementById("mydiv");
div.innerHTML="hahahaha";
jquery：
$("#mydiv").html("hehehehehe");
2.隱式迭代
$(".redtext").html("************");
選擇所有的redtext標籤後不需要遍歷，就可以把所有標籤的內容更改
3.鏈式編程
$("#mydiv").css("background-color","red").css("border-radius","50px").html("鄭州");
賦值取值與javascript中區別：
jquery ：
html
text
val
javascript：
innerHtml
innerText
value
選擇器
選中所有的段落：
$("p").html("@@@@@@@@@@@@@@@@@@@@");
選中所有具有id="mydiv"屬性的標籤
$("#mydiv").html("hehehehehe");
選中所有具有class="redtext"屬性的標籤
$(".redtext").html("************");
對象轉換
jquery對象—> dom對象
加上下標
$(".mydiv")[0]
或
$(".mydiv").get(0)
在循環里加了下標也是dom對象
dom對象—>jquery對象
放$()裏面
屬性
attr
$("img").attr("src","img/w3.jpg");
$("img").attr("title");
$("img").removeAttr("title");
控制的是標籤上的屬性
input type=“checked” 標籤屬性checked=“checked”
$("myck").attr("checked","checked");
$("myck").removeAttr("checked");
prop
$("img").prop("src","img/w3.jpg");
控制的是dom對象的屬性
Checkbox checked=true/false
$("#myck").prop("checked",true);
$("#myck").prop("checked",false);
使用attr移除屬性後無法再次設置屬性，所以使用jquery實現選中和取消選中時最好使用prop
全選
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<script type="text/javascript" src="js/jquery1.11.3.min.js" ></script>
<script type="text/javascript">
$(function(){
$("#all").click(function(){
$(".ck").prop("checked",$(this).prop("checked"));
})
})
</script>
<body>
<input type="checkbox" id="all"/>全選
<br />
<input type="checkbox" class="ck"/>A
<input type="checkbox" class="ck"/>B
<input type="checkbox" class="ck"/>C
<input type="checkbox" class="ck"/>D
</body>
</html>
樣式
css
訪問匹配元素的樣式屬性
$("p").css("color": "#ff0011").css("background": "blue");
按照json格式：{屬性:值,屬性:值}
$("p").css({ "color": "#ff0011", "background": "blue" });
$("p").css({ "color": "#ff0011", "background": function(){return "blue";} });
凡是寫值的地方都可以用函數代替
css類
addClass
爲每個匹配的元素添加指定的類名
$("p").addClass("selected");
removeClass
從所有匹配的元素中刪除全部或者指定的類
$("p").removeClass("selected");
toggleClass
如果存在（不存在）就刪除（添加）一個類
$("p").toggleClass("selected");