PHP-----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 #one
  9 {
 10     color:#00C;
 11     font-size:14px;
 12     background-color:#F00;
 13     
 14 }
 15 
 16 </style>
 17 
 18 </head>
 19 <div id="one">one</div>
 20 <div class="test" bs="aa">two</div>
 21 <div class="test">there</div>
 22 <div class="test">four</div>
 23 <input type="text"  bs="aa" name="uid" id="uid" />
 24 <body>
 25 </body>
 26 <script type="text/javascript">
 27 $(document).ready(function(e) {
 28     
 29     //JS方式
 30     //1.根据ID取元素,DOM对象
 31     //var div = document.getElementById("one");
 32     //2.根据class取元素
 33     //var div = document.getElementsByClassName("test");
 34     //3.根据name取
 35     //var bd = document.getElementsByName("uid");
 36     //4.根据标签名取
 37     //var div = document.getElementsByTagName("div");
 38     //操作内容
 39     //1.非表单元素
 40     //alert(div.innerText);
 41     //div.innerText = "aaa";
 42     //div.innerHTML;
 43     //2.表单元素
 44     //div.value
 45     //操作属性
 46     //div.setAttribute("","");//设置属性
 47     //div.removeAttribute("");//移除属性
 48     //div.getAttribute("");//获取属性
 49     //操作样式
 50     //div.style.backgroundColor = "red";
 51     //获取样式
 52     //alert(div.style.color);只能获取内联样式
 53     //在数组里面如果要取DOM对象使用索引的方式,如果要取Jquery对象使用eq()
 54     //JQUERY方式
 55     //1.根据ID取元素,Jquery对象
 56     //var div = $("#one");
 57     //2.根据class取元素
 58     //var div = $(".test");
 59     //3.根据属性取
 60     //var db = $("[name='uid']");
 61     //4.根据标签名取
 62     //var div = $("div");
 63     //5.组合选取
 64     //var div = $("div.test");
 65     
 66     
 67     //操作内容
 68     //1.非表单元素
 69     //alert(div.text());//取值
 70     //div.text("aaaa");//赋值
 71     //div.html();
 72     //2.
 73     //div.val();//取值赋值都用这一种
 74     
 75     
 76     //操作属性
 77     //div.attr("text","aa");//设置属性
 78     //div.removeAttr("");//移除属性
 79     //div.attr();//获取属性
 80     
 81     
 82     //操作样式
 83     //div.css("background-color","#009");
 84     //获取样式
 85     //alert(div.css("color"));
 86     
 87     
 88     //操作元素
 89     //var str = "<div id='a' style='100px; height:100px; background-color:red'></div>";
 90     
 91     //div.append(str); //追加元素
 92     //$("#a").remove(); //移除某个元素
 93     
 94     
 95 
 96 });
 97 
 98 
 99 
100 </script>
101 </html>