//窗口
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript">
//调用jquery
//相当于window.load()当窗口加载完毕之后触发
$(function(){
//alert("hello jquery");
//选择器
//id选择器
$("#bt1").click(
function (){
alert("点击了按钮 文字=" );
}
);
//标签选择器
//属性过滤器
$("input[type=button]").click(
function (){
alert("通过标签选择器选中了按钮")
}
);
//类选择器
$(".cl_2").click(
function (){
alert("通过类选择器选中了按钮")
}
);
//使用dom方式获取元素
var bt_3 =document.getElementById("bt3");
$(bt_3).click(
function()
{
alert("从DOM对象转为jQuery对象");
}
);
//从Jquery对象转为DOM对象
var $jbt_1=$("#bt1");
alert("集合长度 ="+$jbt_1.length);
var bt_1=$jbt_1.get(0);
alert("DOM按钮的内容="+bt_1.value);
var $jbt_4=$("button");
var bt_4= $jbt_4[0];
alert("DOM按钮的内容="+bt_4.firstChild.nodeValue);
$jbt_4.click(
function (){
alert("button 的文本="+$(this).text())
}
);
})
</script>
</head>
<body>
测试
<br>
<input type="button" id="bt1" value="按钮1">
<br><br>
<input type="button" class="cl_2" id="bt2" value="按钮2">
<br><br>
<input type="text" class="cl_2">
<br><br>
<input id="bt3" value="按钮3" type="button">
<br><br>
<button id="bt4">按钮4</button>
<br><br>
<button id="bt5">按钮5</button>
</body>