jquery常用语句

1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2 <html xmlns="http://www.w3.org/1999/xhtml">
  3 <head>
  4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5 <title>无标题文档</title>
  6 <script src="jquery-1.11.2.min.js"></script>
  7 <style type="text/css">
  8 #aa{ background-color:#36C}
  9 </style>
 10 </head>
 11 
 12 <body>
 13 
 14 Jquery
 15     $代表选择器
 16 
 17 JS
 18     选取元素
 19     操作内容
 20     操作属性
 21     操作样式
 22     
 23 <div id="aa" style="width:100px; height:100px;">11</div>
 24 
 25 <div class="aa">22</div>
 26 <span class="aa">33</span>
 27 
 28 <input type="text" name="uid" aa="bb" id="cc" />
 29 
 30 <input type="checkbox" value="1" id="dd" />
 31 
 32 </body>
 33 <script type="text/javascript">
 34 
 35 //页面加载完成
 36 $(document).ready(function(e) {
 37     
 38     //页面加载完成之后执行
 39     
 40     //JS
 41         //找元素,DOM对象
 42         //var a = document.getElementById("aa");
 43         //alert(a);
 44         
 45         //var a = document.getElementsByClassName("aa");
 46         //alert(a[1]);
 47         
 48         //var a = document.getElementsByTagName("div");
 49         
 50         //var a = document.getElementsByName("uid");
 51         //alert(a[0]);
 52         yua
 53         //操作内容
 54         //a.innerHTML //操作元素里面的html代码
 55         //a.innerTEXT //操作元素里面的文本
 56         
 57         //a.value //操作表单元素的值
 58         
 59         //操作属性
 60         //a.setAttribute("",""); //设置
 61         //a.removeAttribute(""); //移除
 62         //a.getAttribute(""); //获取
 63         
 64         //操作样式
 65         //a.style.backgroudColor = "red";
 66         
 67     
 68     //Jquery
 69         //找元素,Jquery对象
 70         //var b = $("#aa"); //根据ID找
 71         //alert(b[0]);
 72         
 73         //var b = $(".aa"); //根据class找
 74         //alert(b[1]); //找到的是DOM对象
 75         //alert(b.eq(1)); //找到的是Jquery对象
 76         
 77         //var b = $("div"); //根据标签名找
 78         //alert(b[0]);
 79         
 80         //var b = $("[id='aa']"); //根据属性找
 81         //alert(b[0]);
 82         
 83         //操作内容
 84             //非表单元素
 85             //b.html(); //操作元素里面的HTML代码
 86             //b.text(); //操作元素里面的文本
 87             
 88             //表单元素
 89             //b.val("hello");
 90             
 91         //操作属性
 92             //设置属性
 93             //b.attr("bs","test");
 94             //获取属性
 95             //alert(b.attr("aa"));
 96             //移除属性
 97             //b.removeAttr("aa");
 98             
 99             //b.prop("checked",false);
100             
101         //操作样式,可以获取内嵌的样式
102         //b.css("background-color","red");
103         //alert(b.css("width"));
104         //alert(b.css("background-color"));
105         
106 });
107 
108 </script>
109 </html>
猜你喜欢
