前端当中在文档加载时执行的两个函数

最新推荐文章于 2024-08-16 10:26:49 发布
原创 最新推荐文章于 2024-08-16 10:26:49 发布 · 683 阅读 · 0 ·
本内容遵循CC 4.0 BY-SA版权协议
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
收录于
前端

当前文章被收录于：

前端
8 篇文章 0 人学习
订阅专栏 查看详情
本文对比了前端中window.onload与$(document).ready(function(){}

在前端当中，有两种文档加载函数

  • Window.onload() (BOM对象的方法)
  • $(function(){}) （JQuery中的方法ready()）
两者区别
  1. window.onload只能执行一次,但是$(document).ready(function(){ })可以执行多次
  2. window.onload是等文件资源全部加载完成之后再来执行函数,但是$(document).ready(function(){ })只要htmlDOM树生成后立刻执行函数

小结
建议使用JQuery的方式，简便而且可以使用多次

标签
#jquery
微前端与Serverless的结合：动态加载云函数的实现
AI架构全栈开发实战笔记
06-13 1010
本文旨在探索微前端架构与Serverless技术的结合点，特别是如何利用Serverless云函数实现微前端的动态加载能力。我们将覆盖从概念理解到实际实现的完整过程，包括架构设计、核心原理和代码实践。首先介绍微前端和Serverless的核心概念然后分析两者结合的价值和可行性接着深入探讨动态加载云函数的技术实现最后通过实际案例展示完整实现微前端：一种将前端应用分解为独立、可独立开发和部署的小型应用的前端架构方法Serverless。
页面加载之window.onload=function(){} 和 $(function(){})的区别
on_the_way_the_way的博客
10-23 1万+
通用的页面加载js有四种方式： 1.window.onload = function(){}; —-js 2.$(window).load(function(){});——Jquery 3.$(document).ready(function(){});–Jquery 4.$(function(){});———————Jquery 其中1和2为同一种，3和4为同一种 1、2表示：页面全部
window.onload的作用
weixin_53140824的博客
12-05 5671
window.onload的作用 window.onload的作用，是文档和资源都加载完成后执行。 当我们把script标签放到head里面去获取元素的时候，我们会发现获取到的值是null那是因为代码从上往下执行，当获取标签的时候，标签还没有被加载。 <head> <script> window.onload=function(){ document.getElementById("but").onclick=function(){
$ (function() {})的用法
qq_1872583947的博客
10-19 2024
JQuery 的代码我们通常会包裹在一个$(function(){})函数中，jq 的$(function(){})也就是$(document).ready(function(){})的简写，与之对应的原生 js 的window.onload事件，这俩者之间到底有什么区别呢？ $(function () { console.log("ready执行"); }); $(function() { console.log("ready1执行"); }); window.onload = fun
javascript 加载两个script顺序
最新发布
weixin_40610696的博客
08-16 160
我整理的一些关于【Java】的项目学习资料（附讲解～～）和大家一起分享、学习一下：https://d.51cto.com/f2PFnNJavaScript 加载两个 Script 的顺序 在前端开发中，JavaScript 的加载顺序对页面的功能和表现有着重要的影响。特别是当我们需要在一个页面中引入多个 JavaScri...
Javascript的加载与执行顺序
一土宁的博客
03-31 3万+
1. 按块加载并执行对于一个HTML文档，浏览器的解析顺序为：按照文档流，从上到下逐步解析页面的结构。JavaScript代码作为通过标签嵌入或引入的脚本，也HTML文档的组成部分。因此，JavaScript代码在装载时的执行顺序也是根据脚本标签&lt;script&gt;的出现顺序来确定的。但是，浏览器加载JavaScript时有个特点，那就是载入之后立即就会执行（先编译后执行），因为JavaS...
怎样使页面加载完再执行js代码
qq_37418556的博客
05-27 8040
怎样使页面加载完再执行js代码 由于HTML页面的加载顺序是从上到下，所以js代码要写在页面靠下的位置，否则可能会发生元素获取不到的问题，为了避免这种情况，可以通过页面元素加载完之后，再执行js代码，这样即使代码写在html元素前面也没有问题。 一、在原生js中，在页面所有元素加载完执行js代码 如下： 1.使用load事件 <script> window.addEventListener('load', function() { //js代码
页面加载完成后自动执行一个方法函数的JQ、JS方法
阅读之后，对你有帮助，那就点个赞再走吧
04-19 2018
一、JS方法 1.最简单的调用方式，直接写到html的body标签里面： <body onload="myfunction()"> <html> <body onload="func1();func2();func3();"> </body> </html> 2.在JS语句调用： <scr...
jquery在文档加载之后运行函数
第十七签
08-25 2061
文档加载之后运行函数
不加载执行js_踩过的js坑--js的加载和执行
weixin_29541589的博客
01-11 772
刚进公司写代码，我继承了传说中的ctrl+c和ctrl+v的优良传统，并对此感到十分的愉悦！直到遇到它。上头给一个任务，借用一个插件，快速生成流程页面；按理来说，是非常简单的，毕竟都做过了很多案例了；但是这次需要用到js来做一个处理，其实也是很简单的一个问题；但是对于我来说，会有很多弊端，因为我对于js前端的知识不是很系统，对于一个页面的形成，我可以很自豪的说，完全是不知道的！带着这样子的模糊概念...
JS，两种在页面加载完成后自动执行的方法（ready，onload）
Annn_kk的博客
04-24 2万+
JS，两种在页面加载完成后自动执行的方法 1.jQuery的ready事件，需要引入jQuery的包才能使用，表示文档结构已经加载完成（不包含图片等非文字媒体文件）； ready可以多次调用，可以绑定多个函数执行，在DOM文档结构加载完毕后，按照绑定顺序执行这些函数，后面函数不会覆盖前面函数的引用。 多种写法 $(function(){ alert(do something); }); $(f...
动态加载执行 JS 文件、前端文件下载方式汇总
蚩尤后裔-汪茂雄
11-07 3145
目录 重新加载 JS 文件 动态加载 JS 文件 对话框 confirm 方法 开发中根据需求来动态加载 JS 文件，或者在某些情况下需要重新加载某个 JS 文件。 重新加载 JS 文件 应用中的某些 JS 文件如果在某些条件下需要重新加载时，最简单的思路就是先删除原来的 JS 文件，再重新添加。为了方便，使用 JQuery 操作。 <!DOCTYPE html> &l...
vue两个异步方法顺序执行
weixin_44364001的博客
01-09 1万+
需求：两个异步函数按顺序执行，首先获取第一个异步函数的返回的值，接着在第二个异步函数里面调用 方法：先在第一个异步函数里返回一个promise，接着用async和await调用它 第一个异步方法： getAllNotice() { let data = { "searchParams": [{ "fieldName": "equipmentId", "operate": "eq", "value": "000000" }], "siz
关于文档加载完成事件 — onload 事件、ready事件
贵林之恋的博客
06-14 3073
一、$(window).load(function(){})、window.onload=function(){}、$(document).ready(function(){})的区别：       1、$(window).load(function(){})、window.onload=function(){}              是页面中的所有元素（包括图片、flash、引用文件）等...
前端笔记之jQuery（上）加载函数的区别&对象&操作HTML/CSS&动画&选择器
RopeHuo
03-31 235
一、jQuery简介 1.0 JavaScript编程比较恶心的地方 恶心1：选择元素麻烦，全线兼容的方法只有getElementById()和getElementsByTagName()两个。其他的方法是不都兼容的。getElementsByClassName()通过类名选择元素，IE9开始兼容。 恶心2：样式操作麻烦，得到原生样式，需要我们自己造轮子getStyle() 恶心...
页面加载时自动执行（加载）js的几种方法
热门推荐
jasonhouse的博客
05-05 3万+
页面自动执行（加载）js的几种方法      一、JS方法      1.最简单的调用方式，直接写到html的body标签里面：      &lt;html&gt; &lt;body onload="load();"&gt; &lt;/body&gt; &lt;/html&gt;      2.在JS语句调用：      &lt;script type="text/javascript"&
3种jquery文档加载是执行方法
菜菜鸟的博客
07-24 1799
1. $(function( ){ }）； $(function(){ 　　$("#name").click(function(){ 　　　　//adding your code here 　　}); }); 2. $(document).ready(function( ){ }) $(document).ready(function(){ 　　$("#name").cl...
前端页面加载时就执行的方法
shimmerkaiye的博客
08-05 1755
直接上代码： window.onload = MyInitFunc; function MyInitFunc(){ debugger; var imgUrl = $("#img").attr("src"); console.log(imgUrl); if(document.getElementById('img').src){ alert(1); }else{ alert(2); } }
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值