JS浏览器加载一个页面的过程

谁践踏了优雅 2023-01-20 15:57 81阅读 0赞

加载过程->从上向下逐行进行加载

<!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="UTF-8">
    		<title></title>
    		<script type="text/javascript">
    		
    			/* * 浏览器在加载一个页面时，是按照自上向下的顺序加载的， * 读取到一行就运行一行,如果将script标签写到页面的上边， * 在代码执行时，页面还没有加载，页面没有加载DOM对象也没有加载 * 会导致无法获取到DOM对象 */
    			
    			
    			
    			/* * onload事件会在整个页面加载完成之后才触发 * 为window绑定一个onload事件 * 该事件对应的响应函数将会在页面加载完成之后执行， * 这样可以确保我们的代码执行时所有的DOM对象已经加载完毕了 * */
    			window.onload = function(){ 
    				//获取id为btn的按钮
    				var btn = document.getElementById("btn");
    				//为按钮绑定一个单击响应函数
    				btn.onclick = function(){ 
    					alert("hello");
    				};
    			};
    			
    			
    		</script>
    	</head>
    	<body>
    		
    		<button id="btn">点我一下</button>
    		
    		
    		
    	</body>
    </html>

发表评论取消回复

表情：

评论列表（有 0 条评论，81人围观）

还没有评论，来说两句吧...

相关阅读

相关 js实现页面重新加载

1、reload 方法，该方法强迫浏览器刷新当前页面。语法：location.reload(\[bForceGet\]) 参数： bForceGet，可选参数

灰太狼/ 2023年06月23日 02:47/ 0 赞/ 123 阅读

相关 JS浏览器加载一个页面的过程

加载过程->从上向下逐行进行加载 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"

谁践踏了优雅/ 2023年01月20日 15:57/ 0 赞/ 82 阅读

相关浏览器页面加载过程

当用户输入网址之后浏览器究竟干了什么，当然先是域名解析，然后建立链接......网络层面不是我想说的重点，好多前辈大牛都讲过，就一笔带过，着重说的是浏览器在拿到HTML、CSS

╰半橙微兮°/ 2022年10月01日 08:47/ 0 赞/ 321 阅读

相关浏览器加载、解析、渲染的过程

浏览器的主要功能　　浏览器的主要功能是将用户选择的web资源呈现出来，它需要从服务器请求资源，并将其显示在浏览器窗口中，资源的格式通常是HTML，也包括PDF、image及

矫情吗；*/ 2022年06月16日 06:16/ 0 赞/ 310 阅读

相关 HTML 页面加载过程

window.onload 和 DOMContentLoaded 的区别从输入 url 到得到 html 的过程浏览器渲染页面的过程 window.o

客官°小女子只卖身不卖艺/ 2022年05月26日 12:41/ 0 赞/ 385 阅读

相关加载页面增加一个loading

1.设置css(如果写入css文件,就要在html引入css) <style> .loader { //这个注解会影响到页面中<a>和<button>的点击事件 po

心已赠人/ 2022年05月19日 00:40/ 0 赞/ 371 阅读

相关 HTML页面加载过程

window.onload 和 DOMContentLoaded 的区别从输入 url 到得到 html 的过程浏览器渲染页面的过程 window.o

ゞ浴缸里的玫瑰/ 2022年05月16日 04:44/ 0 赞/ 363 阅读

相关 JS页面数据懒加载

页面数据懒加载。Div移动到可视区域再去ajax加载内容。最近有需求做页面的多个table用于加载数据，但是用户浏览页面的时候不需要一次将页面所有的东西加载出来，比如页面上

我会带着你远行/ 2022年03月10日 00:54/ 0 赞/ 640 阅读

相关浏览器的渲染过程及页面加载的优化方案

首先要感谢趣链的大佬在礼拜六还抽时间来给我面试，虽然个人表现不佳，但本来就是抱着去看看世界的心态面试的，不如先解决一下面试中的问题吧。本文原题为前端面试题，由于每题都可以

痛定思痛。/ 2021年09月15日 20:44/ 0 赞/ 529 阅读

相关 js 页面加载顺序

![在这里插入图片描述][20191204204200680.png] ![在这里插入图片描述][20191204204211280.png] [20191204204

冷不防/ 2021年07月24日 15:58/ 0 赞/ 601 阅读