Jquery页面加载函数比较

最新推荐文章于 2024-01-02 21:44:55 发布

世宇同学

最新推荐文章于 2024-01-02 21:44:55 发布

阅读量247

点赞数

分类专栏： JavaScrip

本文链接：https://blog.csdn.net/weixin_40327259/article/details/89226826

版权

JavaScrip 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

1.第一种()

$(fn)

2.第二种

$(document).ready(fn)

3.第三种

$().ready(fn)

注意：第一种，第二种，和第三种都是一样的。并且一个页面可以配置多个页面加载函数，不会被覆盖。

执行时机：等待DOM结构加载完成以后就执行。

4.第四种

(fn)()

此种方式和放在页面的顺序有关，如果放在前面，可能获取某些元素对象的时候可能会失败。放在后面才会成功。

代码例子如下：

into.html

<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<title>into</title>
		<script type="text/javascript" src="js/jquery-1.9.1.js"></script>

		<style>
			div {
				width: 300px;
				height: 100px;
				background-color: #8ad6ff;
			}
		</style>

		<body>
			<div id="div1">点击第一个div，隐藏此div</div>
			<div id="div2">点击第二个div，隐藏此div</div>
			<div id="div3">点击第三个div，隐藏此div</div>
			<div id="div4">点击第四个div，隐藏此div</div>
		</body>
		<script type="text/javascript" src="js/into.js"></script>
</html>

into.js

(function() {
	$("#div1").click(function() {
		$(this).hide();
	});
})()

$(function() {
	$("#div2").click(function() {
		$(this).hide();
	});
})

$().ready(function() {
	$("#div3").click(function() {
		$(this).hide();
	});
})

$(document).ready(function() {
	$("#div4").click(function() {
		$(this).hide();
	});
})

世宇同学

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
Jquery页面加载函数比较

1.第一种()$(fn)2.第二种$(document).ready(fn)3.第三种$().ready(fn)注意：第一种，第二种，和第三种都是一样的。并且一个页面可以配置多个页面加载函数，不会被覆盖。执行时机：等待DOM结构加载完成以后就执行。4.第四种(fn)()此种方式和放在页面的顺序有关，如果放在前面，可能获取某些元素对象的时候可能会...
复制链接

扫一扫