<script src="../jquery-1.11.2.min.js"></script> <style type="text/css"> #one { color:red; font-size:30px; background-color:#60F; } </style> </head>
<body>
<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="绑定事件" />
</body> <script type="text/javascript">
$(document).ready(function(e) { //JS方式 //1.根据ID取元素，DOM对象 //var div = document.getElementById("one"); //2.根据class取元素 //var div = document.getElementsByClassName("test"); //3.根据name取 //var bd = document.getElementsByName("uid"); //4.根据标签名取 //var div = document.getElementsByTagName("div"); //操作内容 //1.非表单元素 //alert(div.innerText); //div.innerText = "aaaa"; //div.innerHTML; //2.表单元素 //div.value //操作属性 //div.setAttribute("",""); //div.removeAttribute(""); //div.getAttribute(""); //操作样式 //div.style.backgroundColor = "red"; //alert(div.style.color);只能获取内联样式 //在数组里面如果要取DOM对象使用索引的方式，如果要取Jquery对象使用eq() //JQUERY方式 //1.根据ID取元素，Jquery对象 var div = $("#one"); //2.根据class取 //var div = $(".test"); //3.根据属性取 //var bd = $("[bs='aa']"); //4.根据标签名取 //var div = $("div"); //5.组合选取 //var div = $("div span"); //操作内容 //1.非表单元素 //alert(div.text()); //div.text("aaaa"); //div.html(); //2.表单元素 //div.val("aaa"); //操作属性 //div.attr("test","aa"); //div.removeAttr("test"); //div.attr("test"); //操作样式 //div.css("background-color","yellow"); //alert(div.css("color")); //操作元素 //var str = "<div id='a' style='100px; height:100px; background-color:red'></div>"; //div.append(str); //追加元素 //$("#a").remove(); //移除某个元素 /*$(".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>