JQuery魔力(一）$("tagName") DOM 中的 getElementsByTagName()方法在JQuery中的表現就是$("tagName")這麼簡單！
匿名函數來解決 window.onload 事件
對頁面上的所有"div"標記下手，定義統一的外觀
對"body"標記定義外觀
動態添加一個"span"標記將其放置在"body"裡
. 代碼如下:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>JQuery 測試</title>
<script src="js/jquery-1.7.1.min.js" type="text/javascript">
</script>
<script type='text/javascript'>
$(function () {
$("div").width(100)
.css("color", "red")
.css("margin", "20px")
.css("border", "dotted 1px green");
$(document.body).css("background-color", "#cccccc");
$("<span>Four</span>").appendTo("body");
});
</script>
<script type="text/javascript">
$(function () {
var v = $("div");
alert(v.length);
for (var i = 0; i < v.length; i++) {
alert(v[i].innerHTML);
}
});
</script>
</head>
<body>
<div>
第一個div</div>
<div>
第二個div</div>
<div>
第三個div</div>
</body>
</html>
JQuery魔力（二） selector tag標簽（可以是：p、div、button …）標簽本身具有ID、Class等屬性
. 代碼如下:
$("tag") //取得頁面中的某種標簽的集合 同 document.getElementsByTagName("tag")
$("#id") //據id取得頁面中的元素 同 document.getElementById("id")
$("tag#id") //據id取得標簽為tag元素集合
$(".class") //據class取得元素集合 同 document.getElementsByClassName("class")
$("tag.class") //據class取得標簽為tag的元素集合
$("tag1 tag2") //取得tag1內的tag2類型元素 同
$("tag1 > tag2")
$("tag1:has(tag2)") //取得包含tag2的tag1類型的元素集合
上面的selector充分體現了JQuery存在的價值,就是語法簡潔且語義容易理解。