今天学习了jquery,可以简化JS代码的编写,基本语法是$(选择器).方法(),不仅可以通过jquery的选择器$()找到元素,还可以创建元素,并将创建的元素插入到当前的页面中,最后还了解了jquery的执行方式。
代码:
实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>jquery的两种引入方式与$(document).ready()的使用方式</title> <style type="text/css"> .SS{ color: red; } </style> <!-- 引入方式1:通过本地引入 --> <!-- <script type="text/javascript" src="../js/jquery-3.3.1.js"></script> --> <!-- 引入方式2:通过外部网站引入 --> <script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script> <script type="text/javascript"> // $(document).ready()的使用 // $(document).ready(function(){ // $('h2 span').addClass('SS') // }) // 简写 $(function() { $('h2 span').addClass('SS') }) </script> </head> <body> <h2>Hello <span>world!</span></h2> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
总结:
jquery可以通过两种方式引入,包括从本地引入和从网络引入。
$(document).ready()事件:只要DOM创建完成就可以触发,不必等到元素全部加载完成。
而window.onload事件必须要在dom树生成,外部资源全部加载完毕才可以触发。