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…

JavaScript之Highlight.js语法高亮显示神器集成说明

JavaScript之Highlight.js语法高亮显示神器集成说明 文章目录 JavaScript之Highlight.js语法高亮显示神器集成说明1. highlight.js1. 官网2. what is highlight.js? 2. 基本使用1. 作为一个模块使用2. 作为HTML标签使用1. cdnjs2. jsdelivr3. unpkg4. Self hosted(自主管理) 3…

市场复盘总结 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…

C++ STL——vector容器

1&#xff0c;vector的容量和大小 功能描述&#xff1a;对vector容器的容量和大小操作 函数原型&#xff1a; empty&#xff08;&#xff09;&#xff1a;判断容器是否为空 capacity&#xff08;&#xff09;&#xff1a;容器的容量 size&#xff08;&#xff09;&#xf…

第2章---初次接触GAS系统

文件结构&#xff1a; 更新文件将高亮显示 Source Private AbilitySystemComponent RPGAbilitySystemComponent.cppRPGAttributeSet.cpp Character PGGameCharacterBase.cppRPGGameEnemy.cppRPGGamePlayerCharacter.cpp Game RPGGameModeBase.cpp Interaction EnemyInterface…

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;有需要学…

JavaBean、POJO、Entity、ValueObject区别

JavaBean、POJO、Entity 和 ValueObject&#xff08;也称为VO&#xff09;是软件开发中常用的一些术语&#xff0c;它们在特定上下文中可能有所不同&#xff0c;但通常用于描述数据传输对象或模型的不同概念。以下是它们的一般区别&#xff1a; JavaBean JavaBean是一种符合特定…

基于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 摆臂子…

【华为OD机试】转盘寿司【C卷|100分】

【华为OD机试】-真题 !!点这里!! 【华为OD机试】真题考点分类 !!点这里 !! 题目描述 寿司店周年庆,正在举办优惠活动回馈新老客户。 寿司转盘上总共有 n 盘寿司,prices[i] 是第 i 盘寿司的价格, 如果客户选择了第 i 盘寿司,寿司店免费赠送客户距离第 i 盘寿司最近的下一…

LeetCode 2161.根据给定数字划分数组

给你一个下标从 0 开始的整数数组 nums 和一个整数 pivot 。请你将 nums 重新排列&#xff0c;使得以下条件均成立&#xff1a; 所有小于 pivot 的元素都出现在所有大于 pivot 的元素 之前 。 所有等于 pivot 的元素都出现在小于和大于 pivot 的元素 中间 。 小于 pivot 的元素…

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…

题记(48)--L1-016 查验身份证

目录 一、题目内容 二、输入描述 三、输出描述 四、输入输出示例 五、完整C语言代码 一、题目内容 一个合法的身份证号码由17位地区、日期编号和顺序编号加1位校验码组成。校验码的计算规则如下&#xff1a; 首先对前17位数字加权求和&#xff0c;权重分配为&#xff1a;{…

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

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

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

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

探索程序员职业赛道:中国行业发展趋势与市场需求分析

目录 写在开头1.中国行业发展趋势与市场需求分析1.1. 前端开发1.2. 后端开发1.3. 数据科学与人工智能1.4. 区块链技术1.5 软件工程与项目管理1.6 嵌入式开发与物联网 2.如何选择适合自己的职业赛道写在最后 写在开头 作为程序员&#xff0c;选择适合自己的职业赛道是至关重要的…

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

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