博客列表 >jquery的两种引入方式与$(document).ready()的使用方式20180402

jquery的两种引入方式与$(document).ready()的使用方式20180402

jobing的博客
jobing的博客原创
2018年04月02日 23:53:131442浏览

今天学习了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>

运行实例 »

点击 "运行实例" 按钮查看在线实例

总结:

  1. jquery可以通过两种方式引入,包括从本地引入和从网络引入。

  2. $(document).ready()事件:只要DOM创建完成就可以触发,不必等到元素全部加载完成。

  3. 而window.onload事件必须要在dom树生成,外部资源全部加载完毕才可以触发。


声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议