02 JS-DOM之--js的加载和window onload

最新推荐文章于 2021-11-17 11:49:40 发布
最新推荐文章于 2021-11-17 11:49:40 发布
阅读量273 收藏 1
点赞数
分类专栏： javascript--DOM
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/liqianmo/article/details/75056865
版权

js的加载和html是同步加载的。

但是网页中的JavaScript需要在文档加载完后再执行，否则可能获取不到对象。

解决办法：

  1. script标签要放在body标签结束之前，这样的话页面加载HTML之后再执行js。不然js的效果显示不出来

  2. 如果想放在头部里面，把所以的js代码放在 window.onload = function () {} 里面。这样的话，页面中所有标签加载完毕之后，再执行这个事件；

这也是书写js代码的两种书写位置。

  • window.onload 方法会将文档中所有的元素加载完毕并且所有的外部文件加载完毕后执行
  • window.onload只能有一个，如果出现多个最后一个会覆盖前面的所有函数。
ruoshui0914
关注
专栏目录
JavaScript--DOM--当DOM树结构完整时，调用指定方法 -- window.onload
norang的博客
06-06 202
如果把这段代码存入外部JavaScript文件，它们将 无法正常运行。因为这段代码的第一行是： var links = document.getElementsByTagName("a"); 这条语句将在JavaScript文件被加载时立刻执行。如果JavaScript文件是 从HTML文档的<head> 部分用<script> 标签调用的，它将在HTML文 档之前加载到浏览器里。同样，如果<script> 标签位于文档底部 </body> 之前，就不能保证
JavaScript--DOM--共享onload 事件
norang的博客
06-06 404
6.3.2 共享onload 事件 我必须执行prepareGallery 函数才能对onclick 事件进行绑定。 如果马上执行这个函数，它将无法完成其工作。如果在HTML文档完成加载之前执行脚本，此时DOM是不完整的。具体到prepareGallery 函数，它的第3行代码将测试"imagegallery" 元素是否存在，如果 DOM不完整，这项测试的准确性就无从谈起，事态的发展就会偏离我 的计划。 应该让这个函数在网页加载完毕之后立刻执行。网页加载完毕时会触发 一个onload 事件，这个事件与win
window.onload与DOM树
weixin_30539625的博客
09-06 99
先看一下问题： 1window.onload=function(){ 2createDom(); 3operateDom(); 4//codestuff 5} 其中createDom（）通过异步请求取得大量数据，然后组织起来；operateDom()是通过遍历操作createDom生成的节点。问题出现了：...
window.onload和DOMReady
acm765152844的博客
02-21 473
JS的加载，是浏览器下载到哪里就执行到哪里，这种特性会导致整个项目没有一个明显的程序入口。 为了解决这个问题，我们需要对代码功能进行划分。JS分成两部分：框架和具体的功能实现。框架部分包括：定义全局变量，命名空间等，和具体功能无关，每个页面都需要加载相同的框架，每个页面都需要加载包括相同的框架。 按照编码习惯，将初始化的工作放在init函数中，他便是网页的程序入口。 JS代码中会出现这样一种
JS基础知识（三十一）：浏览器加载执行JS文件
前端
11-17 2360
文章目录1、js引擎2、语法分析3、预编译3.1 全局预编译3.2 局部预编译3.3 全局对象3.4 AO对象3.5 变量对象3.6 执行环境4、解释执行5、外部脚本的同步加载6、外部脚本的异步加载6.1 defer6.3 window.onload和domready 1、js引擎 脚本编译：由js引擎编译，即V8引擎（js解释器就是js引擎） V8引擎的用处：chrome浏览器的引擎、Nodejs的运行时环境、electron的底层引擎 js引擎在编译和执行js代码会用到3个重要的组件： 解析器：负责将j
JavaScript-DOM(Window)编程知识点整理
MrLsss的博客
01-27 4554
当浏览器加载HTML页面的时候，首先就是DOM结构的计算，计算出来的DOM结构就是DOM树（把页面中的HTML标签像树状结构一样，分析出之间的层级关系)....
实现JavaScript的组成----BOM和DOM详解
10-22
在上面的内容中，还包含了一个简单的JavaScript脚本，演示了如何通过window.onload方法在页面加载完成后绑定事件处理器，并使用window.open方法在点击链接时打开新的浏览器窗口。 DOM是另一种模型，它代表的是文档...
原生JS实现DOM加载完成马上执行JS代码的方法
12-10
在JavaScript中，我们通常使用`window.onload`事件来等待整个页面包括所有资源（如图片、脚本等）加载完毕后执行代码。然而，有时我们只需要在DOM（文档对象模型）结构构建完成后，而不是等待所有资源加载完就执行...
javaScript之windowonload
18岁的蛋蛋博客
07-10 1400
window.onload的用法： 因为页面中的代码一般情况下按照，从上到下，从左到右的顺序执行。 所以当js代码需要获取页面中的元素时，如果script标签在元素的前面，需要加window.onload；如果script放在了元素后面，就不需要加 window.onload。 ...
页面自动执行（加载）js的几种方法
yuanxun05的专栏
04-16 1241
一、JS方法 1.最简单的调用方式，直接写到html的body标签里面： 1 2 body onload="myfunction()"> html> body onload="func1();func2();func3();"> body> html> 2.在JS语句调用： 1
windows页面加载
wxl1390的博客
09-05 1127
通用的页面加载js有四种方式： 1.window.onload = function(){}; —-js 2.(window).load(function());——Jquery3.(window).load(function(){});——Jquery 3.(window).load(function());——Jquery3.(document).ready(function(){});–J...
window.onload在文档加载完成后执行
didie4038的博客
05-02 567
验证a 、b两点疑惑： a.<script src="./main.js"></script>中的window.onload是在html全部加载完了才执行，还是其在html中所处位置之前的加载完就执行？ b. <script src="./main.js"></script>中window.onload有和没有 的区别是什么？ ...
window.onload加载js函数不起作用
zhituji的博客
01-14 7901
使用window.onload加载函数，不起作用 其实是不同js都使用了window.onload加载应用于同一个页面这样通常只有第一个js文件中的函数会被调用。 例： first.js window.onload=function(){ function one(){ ... } } second.js window.onload=function(){
js window onload 用法
dream_heheda的博客
08-20 6234
js 中 window.onload 方法 在页面刚加载完成后执行  比如根据给元素设置初始值，或者设置页面是否只读 参考 一个页面中多个window.onload = function(){}冲突问题解决思路 &lt;script type="text/javascript"&gt; window.onload=cc; function cc(){ aa(); ...
关于JS的--window.onload()方法
热门推荐
冯小东
05-23 1万+
一、window.onload()方法： 该方法用于在网页加载完毕后立刻执行的操作，即当html加载完毕后，立刻执行某个方法等。 二、为什么使用window.onload()? 因为JS中的函数方法等需要在HTML文档渲染完成才可以使用，如果没有渲染完成，此时的DOM树是不完整的，这样JS文件就可能报出"undefined"错误。 三、常见的用法： 简单的立刻执行函数，假
无法获取js创建的dom
weixin_41138247的博客
04-08 606
页面先执行脚本，再渲染DOM。因此无法使用如jquery的$('#id')或D3的select去获取dom。 需要先创建DOM，创建完成后执行window.onload()方法，确保dom已经装载完成。选择器放在此方法中即可。 ...
JS异步加载的三种方式
a6617681的博客
07-19 187
一、同步加载 　　我们平时使用的最多的一种方式。 <script src="http://yourdomain.com/script.js"></script> <script src="http://yourdomain.com/script.js"></script> 　　同步模式，又称阻塞模式，会阻止浏览器的后续处理，...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值