Javascript脚本运行的方式(js写在页面什么地方)

article/2025/9/24 10:23:20

1、脚本写在函数里,body标签里加onload这个函数,意为body加载完成执行函数func。代码如下:

<script type="text/javascript"> 
function func(){……} 
</script> 
<body onload="func()"> </body> 

也可以调用多个函数

<script type="text/javascript"> 
function func1(){……} 
function func2(){……} 
function func3(){……} 
</script> 
<bodyonload="func1();func2();func3()"> </body> 

2、在JS语句调用 ,脚本下载window.onload里也可以,这样不要求脚本在文中的位置。代码如下:

<script type="text/javascript"> 
function func(){……} 
window.onload=func; 
</script> 

这样也可以调用多个函数

<script type="text/javascript"> 
function func1(){……} 
function func2(){……} 
function func3(){……} 
window.onload=function(){ 
func1(); 
func2(); 
func3(); 
} 
</script> 

3、写在window.onload里是为了让文档加在完毕后执行脚本(因为解释型语言是逐条翻译的),也可以不写window.onload,而是将<script type="text/javascript">…</script>写在body后面也可以实现

 

Window.onload = function (){ }和jquery中$(document).ready()或简写$(function(){})的区别

104938_0wLZ_3155313.png

另外,需要注意一点,由于在 $(document).ready() 方法内注册的事件,只要 DOM 就绪就会被执行,因此可能此时元素的关联文件未下载完。例如与图片有关的 html 下载完毕,并且已经解析为 DOM 树了,但很有可能图片还没有加载完毕,所以例如图片的高度和宽度这样的属性此时不一定有效。要解决这个问题,可以使用Jquery中另一个关于页面加载的方法 ---load() 方法。 Load() 方法会在元素的onload事件中绑定一个处理函数。如果处理函数绑定给 window 对象,则会在所有内容 ( 包括窗口、框架、对象和图像等 ) 加载完毕后触发,如果处理函数绑定在元素上,则会在元素的内容加载完毕后触发。 
Jquery代码如下: 

$(window).load(function (){ // 编写代码  
});
等价于 JavaScript 中的以下代码 
Window.onload = function (){ // 编写代码 
}

参考文章:

网站为什么 JS 调用尽量放到网页底部?

Js放到HTML文件中的哪个位置有什么区别

转载于:https://my.oschina.net/zhushangxian/blog/840594


http://chatgpt.dhexx.cn/article/Dh3L5rcW.shtml

相关文章

各浏览器安装JS脚本的方法

转自&#xff1a;各浏览器安装JS脚本的方法【IE、Chrome、FireFox、Opera】很多功能&#xff0c;本来是浏览器原本没有的&#xff0c;我们可以通过扩展来实现&#xff0c;但有的功能&#xff0c;却需要安装脚本&#xff0c;但是大多数浏览器默认都无法支持脚本&#xff0c;这就…

selenium执行js脚本

说明&#xff1a;本篇博客基于selenium 4.1.0 JavaScript是运行在客户端&#xff08;浏览器&#xff09;和服务器端的脚本语言&#xff0c;允许将静态网页转换为交互式网页。可以通过 Python Selenium WebDriver 执行 JavaScript 语句&#xff0c;在Web页面中进行js交互。那么j…

Auto.js脚本编写教程 (一)

一、工具下载安装 手机端&#xff1a;auto.js&#xff08;百度即可&#xff09; PC端&#xff1a; VS Code JDK SDK Tools&#xff08;定位工具: Uiautomatorviewer&#xff09; 注&#xff1a; VS Code 用于代码编写 Uiautomatorviewer用于元素定位&#xff0c;也…

好用的 JS 脚本

文章目录 &#x1f69c;3D 可视化&#x1f69a;ThingJS&#x1f4a1;特点&#x1f4a1;案例 &#x1f69c;拖拽库&#x1f69a;SortableJS&#x1f4a1;特点&#x1f4a1;案例 &#x1f69c;3D 可视化 &#x1f69a;ThingJS 物联网 3D 可视化 PaaS 平台 官网&#xff1a;https…

JavaScript 【基础】 浏览器执行脚本

步骤 一&#xff1a; 在浏览器指定界面按下F12二&#xff1a;找到输入代码的地方三&#xff1a;输入js代码 平时我们做开发的&#xff0c;或者想使用一些外挂&#xff0c;脚本来实现界面的一些更改之类的操作&#xff0c;可以直接在浏览器上面进行。 一&#xff1a; 在浏览器指…

各种JS脚本该怎么使用呢?以城城为例,教程在这里自行食用。

1、首先先下载XXX.js结尾的 链接&#xff1a;https://pan.baidu.com/s/17sXHe_l7eHsUgeHtYRmkHg 提取码&#xff1a;jdck 2、然后用FinalShell工具连接搭建青龙的服务器&#xff0c;把文件上传到青龙面板的这个路径内 每个人搭建的方式不一样我的是这个路径 /root/QL/scripts…

运行JS脚本的几种方式

如何运行JS脚本 直接运行 下载nodejs, 使用node *.js即可执行&#xff0c;方便快捷 如果*.js文件中有引入的第三方模块&#xff0c;需要先下载第三方模块 注意要使用require导入而不是import, import是ES6语法&#xff0c; 较新&#xff0c; 可能会导致js无法运行 初始化pac…

如何在浏览器中执行js脚本

方式1&#xff1a;F12打开调试工具&#xff0c;利用控制台运行JS脚本 方式2: Chrome snippets 小脚本 我们也可以在 Chrome 浏览器中创建一个脚本来执行&#xff0c;在开发者工具中点击 Sources 面板&#xff0c;选择 Snippets 选项卡&#xff0c;在导航器中右击鼠标&#xff…

JavaScript 脚本

一、JavaScript 脚本 Bootstrap 包括一些 JavaScript 帮助用户做出更加充满生机、活动的项目。欢迎学习更多关于如何去调用动态事件、灵活展示的数据和编程性的API选项等。 二、单个引用或者编译 插件可以单独包含&#xff08;使用Bootstrap的单独js/dist/*.js&#xff09;&…

JavaScript脚本基础教程

1、JavaScript简单介绍 Javascript&#xff08;简称js&#xff09; 语言诞生主要是完成页面的数据验证。因此它运行在客户端&#xff0c;需要运行浏览器来解析执行 JavaScript 代码。 JS 是 Netscape 网景公司的产品&#xff0c;最早取名为 LiveScript;为了吸引更多 java 程序…

SAP PP模块后台表关系图

生产主数据关系图 生产业务数据后台数据关系图 更多文章请点击 写于&#xff1a;深圳大鹏 20230717

PaddleClas套件——PP-ShiTuV2模型详解

1. PP-ShiTuV2模型介绍 PP-ShiTuV2 是基于 PP-ShiTuV1 改进的一个实用轻量级通用图像识别系统&#xff0c;由主体检测、特征提取、向量检索三个模块构成&#xff0c;相比 PP-ShiTuV1 具有更高的识别精度、更强的泛化能力以及相近的推理速度*。主要针对训练数据集、特征提取两个…

SAP-PP知识分享-PP常用表积累

原文链接&#xff1a;SAP-PP知识分享-PP常用表积累&#xff08;建议收藏&#xff0c;以后好找&#xff09;导读 本篇给大家简单总结一下PP中常见、常用的表集合。 正文 1.需求相关RESB---预定/相关需求MDKhttps://mp.weixin.qq.com/s/s7SlfOOFf5QjK_oZalaujw 大家可以关注我个人…

PP-LCNet论文全文解析

PP-LCNet: A Lightweight CPU Convolutional Neural Network &#x1f517; PDF Link &#x1f37a; Github Code Section 1 介绍 随着模型参数和FLOPs的加大&#xff0c;模型越来越难以在基于ARM架构的移动端设备或者x86架构的CPU上取得较快的推理速度。虽然有许多优秀的移动…

PP-YOLO论文阅读笔记

PP-YOLO: An effective and efficient implementation of object detector 期刊: arXiv preprint年份:2020 主要内容列举: ① :实现一个有效性和效率相对平衡的对象检测器&#xff0c;可以直接应用于实际应用场景; ② ②:添加了一系列几乎不会增加推断时间的技巧&#xff0c;以…

【paddle】PP飞桨

PP飞桨AI Studio 项目&#xff1a;https://aistudio.baidu.com/aistudio/projectoverview/public 数据集&#xff1a;https://aistudio.baidu.com/aistudio/datasetoverview 课程&#xff1a;https://aistudio.baidu.com/aistudio/course 比赛&#xff1a;https://aistudio.ba…

PP-ShiTu: A Practical Lightweight Image Recognition System

最近看了一个新的分享&#xff0c;关于图像识别的&#xff0c;对于大规模图像搜索以及新物品频繁情况下表现良好。 论文&#xff1a; https://arxiv.org/abs/2111.00775项目&#xff1a; https://github.com/PaddlePaddle/PaddleClas Abstract 近年来&#xff0c;图像识别的…

SAP_PP模块流程

1、SAP_PP模块介绍 PP模块涉及到工程部、财务部、PC、MC、生产部这些业务部门&#xff1b;主要大块在于PMC和生产&#xff1b;是整个SAP的源头所在&#xff1b; 2、整体业务逻辑 工程部:维护物料主数据、收集业务视图、维护BOM、工艺路线、生产版本&#xff0c;这些数据维护…