<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<script type="text/javascript" src="jquery-1.11.1.min.js"></script>
<body>
<script>
//$(document)是将js的DOM对象document转化为jquery 对象，才能调用它的ready方法
$(document).ready(function () {
//这是一个js的DOM对象
var btn = document.getElementById("btn");
//js 里面的onclick是绑定点击事件
btn.onclick = function () {
alert("我是btn 的onclic")
}
//js 里面的click() 方法，是触发click事件
btn.click();
});
</script>
<script>
$(document).ready(function () {
var btn = document.getElementById("btn");
//将js 的DOM对象用$()包装之后就成为jQuery对象，就可以调用它的传一个回调的click 方法
$(btn).click(function () {
alert("DOM对象转化为jQuery对象");
})
})
</script>
<script>
$(document).ready(function () {
//$("button")是一个jQuery 对象,[1]后表示选中第2个button,
//变为一个DOM对象，然后绑定DOM对象的onclick方法
$("button")[1].onclick = function () {
alert("jQuery 对象转化为DOM对象1")
}
// 另外一个方式
$("button").get(0).onclick = function () {
alert("jQuery对象转换成dom对象2");
}
})
</script>
<button id="btn">我是阿牛</button>
<button>我是阿妹</button>
</body>
</html>