JS使用方式

JS是解释性语言,所以不需要搭建类似C#/Java之类的开发运行环境,因为他们是编译型语言。JS一般运行在浏览器中或者node环境中,这里都是JS引擎的功劳。

node环境使用

推荐使用nvm管理node版本,nrm管理代理地址。
安装node:https://nodejs.org/en/
然后随便写一个JS文件,运行node命令运行即可:

HTML中使用

在html中使用方式有两种:

第一种,直接嵌入到html中进行使用

第二种,写到单独的文件中,在html中引用

扩展

延迟脚本(defer),异步脚本(async)

在了解defer和async之前,我们需要了解一下浏览器如何解释html的。一个html文档,浏览器是自上而下进行解析的。也就是从html开始一步一步到/html, 即使head中引用了多个外部js,也会将全部js加载完再向下解析。这就产生了一个问题,如果head中引入了大量外部js,这就会造成页面开始是空白的情况,直到js全部加载完之后,才会根据DOM进行界面显示。
所以可以将外部引用的js放置在body的尾部最好不过:

defer

在html4.01为script添加了defer属性,脚本会延迟到整个页面都解析完毕后再运行,也就是虽然脚本在head中,但是也会延迟到浏览器遇到</html>之后再执行。

注意
在现实中,延迟脚本并不一定会按照顺序执行,也不一定会在DOMContentLoaded事件触发前执行,因此最好只包含一个延迟脚本。

async

顾名思义,该属性的功能就是让浏览器异步加载js,而不是按照常规的顺序解析。

提示:延迟加载,并不影响界面的构造。而是立即下载,延迟执行。
最好使用外部文件来包含JS代码。
可维护性;可缓存,更加具有包容性。

<noscript>元素
用于验证浏览器是否支持JS,如果不支持,进行提示。
<noscript>该浏览器不支持脚本</noscript>

关于我

  • 一个推崇全栈开发的前端开发人员

  • 微信: itrzzh

  • 公众号:全栈道

  • 个人网站:https://www.iotzzh.com

  • 知识星球:全栈道

  • B站:https://space.bilibili.com/285025688

  • 抖音:全栈道

  • github:https://github.com/iotzzh

  • gitee: https://gitee.com/iotzzh

捐赠鼓励

开源不易,如果《全栈道》对你有些帮助,可以请作者喝杯咖啡,算是对开源做出的一点点鼓励吧!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/728228.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

如何确保OKR与公司的整体战略保持一致?

深入理解公司战略 首先&#xff0c;团队或个人需要全面、深入地理解公司的整体战略和目标。这包括了解公司的长期规划、市场定位、竞争优势以及核心竞争力等方面。只有对公司的战略有清晰的认识&#xff0c;才能确保OKR与之保持一致。 如何确保OKR与公司的整体战略保持一致&a…

Navicat安装破解教程

蓝奏云下载地址https://wws.lanzoux.com/b01tqirzc或者链接https://pan.baidu.com/s/15cfQAFdQsn8xSg_2LiQZHg 提取码&#xff1a;q3rd链接&#xff1a;https://pan.baidu.com/s/1WwyCC03qcnqnWKGo-m6ZjA 提取码&#xff1a;pg9uNavicat16目前没有破解方法&#xff0c;15可以&a…

市场复盘总结 20240307

仅用于记录当天的市场情况&#xff0c;用于统计交易策略的适用情况&#xff0c;以便程序回测 短线核心&#xff1a;不参与任何级别的调整&#xff0c;采用龙空龙模式 一支股票 10%的时候可以操作&#xff0c; 90%的时间适合空仓等待 二进三&#xff1a; 进级率中 89% 最常用的…

leetcode:88. 合并两个有序数组

原题地址&#xff1a;https://leetcode.cn/problems/merge-sorted-array/description/ 题目描述 给你两个按 非递减顺序 排列的整数数组 nums1 和 nums2&#xff0c;另有两个整数 m 和 n &#xff0c;分别表示 nums1 和 nums2 中的元素数目。 请你 合并 nums2 到 nums1 中&a…

CVE-2024-25600 WordPress Bricks Builder RCE-漏洞分析研究

本次代码审计项目为PHP语言&#xff0c;我将继续以漏洞挖掘者的视角来分析漏洞的产生&#xff0c;调用与利用..... 前方高能&#xff0c;小伙伴们要真正仔细看咯..... 漏洞简介 CVE-2024-25600 是一个严重的&#xff08;CVSS 评分 9.8&#xff09;远程代码执行 (RCE) 漏洞&am…

Java 8 Supplier函数式接口介绍及代码样例

介绍 供应商接口&#xff08;Supplier Interface&#xff09;是 Java 8 引入的 java.util.function 包的一部分&#xff0c;用于在 Java 中实现函数式编程。它表示一个函数&#xff0c;该函数不接收任何参数&#xff0c;但会产生一个类型为 T 的值。 T&#xff1a;表示结果的类…

Vue3+ts(day01:Vue3简介、初始化Vue3工程)

学习源码可以看我的个人前端学习笔记 (github.com):qdxzw/frontlearningNotes 觉得有帮助的同学&#xff0c;可以点心心支持一下哈&#xff08;笔记是根据b站上学习的尚硅谷的前端视频【张天禹老师】&#xff0c;记录一下学习笔记&#xff0c;用于自己复盘&#xff0c;有需要学…

基于arduino板的写字机设计

目 录 摘 要 Abstract 引 言 1 总体方案设计 1.1 系统方案设计 1.2 系统工作原理 2 硬件电路的设计 2.1 主控模块设计 2.2 驱动模块设计 2.3 时钟模块设计 2.4 总电路设计 3 软件设计 3.1 Arduino开发环境 3.2 主程序设计 3.3 抬笔落笔的子程序设计 3.4 摆臂子…

Seata 2.x 系列【2】数据库事务

有道无术&#xff0c;术尚可求&#xff0c;有术无道&#xff0c;止于术。 本系列Spring Boot 版本 3.1.0 本系列Seata 版本 2.0.0 源码地址&#xff1a;https://gitee.com/pearl-organization/study-seata-demo 文章目录 1. 概述2. ACID 模型2.1 原子性2.2 一致性2.3 隔离性2…

Postman报错提示 Could not get any response怎么解决

在通过postman请求做接口测试的过程中&#xff0c;有时候会遇到一些报错&#xff0c;当遇到这些报错我们不要着急&#xff0c;看着具体哪里报错&#xff0c;然后进行解决 postman报错 经常使用postman的小伙伴们都应该遇到过一些报错&#xff0c;遇到报错的时候我们不要着急&…

这可是全网网工华为认证学习笔记最完整,最详细的版本,没有之一

文章篇幅较长&#xff0c;耐心看完你一定有所收获。 华为认证是什么&#xff1f; 其实就是由华为公司所提出的评价网络工程师专业能力的一个认证&#xff0c;它分为三个级别&#xff0c;分别是这个华为认证的工程师&#xff08;HCIA&#xff09;&#xff0c;华为认证的高级工程…

CTP-API开发系列之三:柜台系统简介

CTP-API开发系列之三&#xff1a;柜台系统简介 CTP-API开发系列之三&#xff1a;柜台系统简介中国金融市场结构---交易所柜台系统通用柜台系统极速柜台系统主席与次席 CTP柜台系统CTP组件名称对照表CTP柜台系统程序包CTP柜台系统架构图 CTP-API开发系列之三&#xff1a;柜台系统…

重新排序。

问题描述 给定一个数组A和一些查询 L,R求数组中第L至第 R个元素之和。 小蓝觉得这个问题很无聊,于是他想重新排列一下数组使得最终每个查 询结果的和尽可能地大。小蓝想知道相比原数组,所有查询结果的总和最多可 以增加多少? 输入格式 输入第一行包含一个整数n。 第二行包含n个…

钉钉群内自定义机器人发送消息功能实现

文章目录 钉钉群内自定义机器人发送消息功能实现1、设置webhook自定义机器人2、查看官方文档&#xff0c;使用open api3、编写业务代码4、发送成功结果如下 钉钉群内自定义机器人发送消息功能实现 1、设置webhook自定义机器人 设置关键词 添加完成后&#xff0c;获得改机器人的…

直流电磁铁计算公式

直流电磁铁计算公式 1. 磁势2. 磁场强度3. 磁感应强度4. 电磁吸力5. 线圈发热 1. 磁势 产生磁场的磁势计算公式&#xff1a; F N ⋅ I FN \cdot I FN⋅I N&#xff1a;是线圈匝数&#xff0c;I&#xff1a;是线圈中的电流注&#xff1a;线圈过热&#xff0c;可以减小电流&am…

力扣--从前序与中序遍历序列构造二叉树

题目&#xff1a; 思想&#xff1a; 首先先序遍历能确定根节点的值&#xff0c;此时查看该值在中序遍历中的位置&#xff08;如果索引为i&#xff09;&#xff0c;那么i左侧为左子树&#xff0c;i 右侧为右子树。从中序数组中即可看出左子树结点个数为 i&#xff0c;右子树节点…

浅析扩散模型与图像生成【应用篇】(八)——BBDM

8. BBDM: Image-to-Image Translation with Brownian Bridge Diffusion Models 本文提出一种基于布朗桥&#xff08;Brownian Bridge&#xff09;的扩散模型用于图像到图像的转换。图像到图像转换的目标是将源域 A A A中的图像 I A I_A IA​&#xff0c;映射到目标域 B B B中得…

详解事件循环机制

浏览器最主要的进程 &#xff1a; 渲染主线程 如何理解JS的异步 任务没有优先级&#xff0c;但消息队列有优先级 阐述一下JS的事件循环

图书馆管理系统(2)

接下来实现系统的子菜单&#xff0c;在写一个子模块的时候&#xff0c;其他子模块先屏蔽起来&#xff0c;因为没实现&#xff0c;代码运行就通不过 屏蔽起来写上todo&#xff0c;后面(Ctrl键F)搜索&#xff0c;找todo来实现 先来实现图书管理模块 第一步&#xff0c;先要把图…

IDEA 配置文件乱码,项目编码设置

见下图 其中第一二项控制全局以及工程的编码格式&#xff0c;下方的则是 properties 配置文件的格式&#xff0c;统一调整为 UTF-8 后不再乱码