jQuery--引入jq&jq简单方法

时间:2024-10-07 07:01:31


下面用到的有关jq的方法

1 css()

2 ready()

3 click()

还有相对应的js例子


  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title></title>
  5. <!-- jq学习开始
  6. jq导入方式 :1本地 src
  7. 2外网cdn src 网址
  8. 以js和jq的不同例子来学习,他们分别有自己的也只能和自己的方法配合使用 -->
  9. <script src="/jquery/1.9.0/"></script>
  10. </head>
  11. <body>
  12. <a href="#" id="a" >点击变色</a>
  13. </body>
  14. <script type="text/javascript">
  15. /*点击a 变色
  16. 1 id不需要加[0],因为只有一个
  17. 2 onclick放在最上面不加上onload就会报错 ::Uncaught TypeError: Cannot set property 'onclick' of null
  18. 所以放在最下面或者加onload PS(前端优化 js放最下面 不堵塞前面html的解析) */
  19. //js例子
  20. /*var a = ('a');
  21. = function(){
  22. = "10px orange solid";
  23. }
  24. */
  25. // jq例子
  26. var a = $('a');
  27. a.css('color','yellow').click(function(){
  28. $(this).css('border','10px solid orange');
  29. });
  30. // js的onload jq也有对应的
  31. // js例子
  32. /* = function(){
  33. alert('abc');
  34. }
  35. */
  36. // jq例子
  37. $(document).ready(function(){
  38. alert('abc');
  39. });
  40. // 还可简写
  41. /*$(function(){
  42. });*/
  43. /* 和ready的区别
  44. 1 onload把整个页面解析后才去执行 包括图片 视频等
  45. $(document).ready只要把body里解析出来后就执行 不包括上面图片等,所以这个更快一点
  46. 2onload只能写一个 写多也覆盖
  47. ready可写多个 依次执行
  48. */
  49. </script>
  50. </html>



如果引入jq时首选cdn 备用本地jq文件,如下写