歡迎來到Linux教程網
Linux教程網
Linux教程網
Linux教程網
Linux教程網 >> Linux編程 >> Linux編程 >> 使用jQuery基本選擇器選擇元素

使用jQuery基本選擇器選擇元素

日期:2017/3/1 10:58:18   编辑:Linux編程

使用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. <title>使用jQuery基本選擇器</title>
  5. <script language="javascript" type="text/javascript"
  6. src="../Jscript/jquery-1.5.2.js"></script>
  7. <style type="text/css">
  8. body{font-size:12px;text-align:center}
  9. .clsFrame{width:300px;height:100px}
  10. .clsFrame div,span{display:none;float:left;
  11. width:65px;height:65px;border:solid 1px #ccc;margin:8px}
  12. .clsOne{background-color:#eee}
  13. </style>
  14. <script type="text/javascript">
  15. $(function(){ //ID匹配元素
  16. $("#divOne").css("display","block");
  17. })
  18. $(function(){ //元素名匹配元素
  19. $("div span").css("display","block");
  20. })
  21. /* $(function(){ //類匹配元素
  22. $(".clsFrame .clsOne").css("display","block");
  23. })*/
  24. $(function(){ //匹配所有元素
  25. $("*").css("display","block");
  26. })
  27. /* $(function(){ //合並匹配元素
  28. $("#divOne,span").css("display","block");
  29. })*/
  30. </script>
  31. </head>
  32. <body>
  33. <div class="clsFrame">
  34. <div id="divOne">ID</div>
  35. <div class="clsOne">CLASS</div>
  36. <span>SPAN</span>
  37. </div>
  38. </body>
  39. </html>
Copyright © Linux教程網 All Rights Reserved