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

捐赠鼓励

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

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

腾讯云服务器和阿里云服务器哪家更优惠?2024价格对比

2024年阿里云服务器和腾讯云服务器价格战已经打响&#xff0c;阿里云服务器优惠61元一年起&#xff0c;腾讯云服务器61元一年&#xff0c;2核2G3M、2核4G、4核8G、4核16G、8核16G、16核32G、16核64G等配置价格对比&#xff0c;阿腾云atengyun.com整理阿里云和腾讯云服务器详细配…

【蓝桥杯基础算法】dfs(上)组合数,全排列

刚接触算法&#xff0c;有没有被递归又循环的dfs吓到&#xff1f;没关系&#xff0c;几个例题就可以彻底掌握&#xff01; 1.全排列 1-n的全排列,如输入3&#xff0c;按顺序对1-3进行排列 //枚举 #include<iostream> #include<algorithm> #include<cstring>…

【Linux基础(二)】进程管理

学习分享 1、程序和进程1.1、程序1.2、进程和进程ID 2、Linux下的进程结构3、init进程4、获取进程标识5、fork系统调用5.1、fork函数实例分析 6、进程的特性7、在Linux下进程指令7.1、终止进程指令7.2、查看进程指令&#xff1a;7.3、以树状图列出进程 8、多进程运行异常情况8.…

【Spring云原生系列】Spring Cloud Stream:消息驱动架构(MDA)解析,实现异步处理与解耦合!

&#x1f389;&#x1f389;欢迎光临&#xff0c;终于等到你啦&#x1f389;&#x1f389; &#x1f3c5;我是苏泽&#xff0c;一位对技术充满热情的探索者和分享者。&#x1f680;&#x1f680; &#x1f31f;持续更新的专栏《Spring 狂野之旅&#xff1a;从入门到入魔》 &a…

2024年抖店新商家自学全套教程,完整版店铺操作流程,如下!

我是王路飞。 想做一个项目的话&#xff0c;就要先了解其完整的流程是怎样的。 做抖店也不例外&#xff0c;没开店的就先了解下抖店的基本信息和大概运营流程&#xff1b;开过店的就先让自己入门并把流程跑通&#xff0c;如此才有承接后续渠道和资源的能力。 今天这篇文章专…

计算机网络:应用层知识点汇总

文章目录 一、网络应用模型二、域名系统&#xff08;DNS&#xff09;三、文本传输协议&#xff08;FTP&#xff09;四、电子邮件五、万维网和HTTP协议 一、网络应用模型 p2p也就是对等模型 二、域名系统&#xff08;DNS&#xff09; 我们知道&#xff0c;随着人们建立一个网站…

【机器学习】【决策树】分类树|回归树学习笔记总结

决策树算法概述 基本概念 决策树&#xff1a;从根节点开始一步步走到叶子节点&#xff0c;每一步都是决策过程 对于判断的先后顺序把控特别严格 一旦将判断顺序进行变化则最终的结果将可能发生改变 往往将分类效果较佳的判断条件放在前面&#xff0c;即先初略分在进行细节分…

python中的文件操作2

文件遍历 在Python中&#xff0c;遍历文件通常指的是逐行读取文件中的内容。这种方式对于处理大型文件特别有用&#xff0c;因为它不需要一次性将整个文件加载到内存中。下面是几种常见的遍历文件内容的方法&#xff1a; 1. 使用with语句和for循环 这是最推荐的方式&#xf…

[Java安全入门]三.URLDNS链

一.前言 在初步学习java的序列化和反序列化之后&#xff0c;这里学习java反序列化漏洞的一个利用链&#xff0c;也是比较基础的一条链。 由于URLDNS不需要依赖第三方的包&#xff0c;同时不限制jdk的版本&#xff0c;所以通常用于检测反序列化的点。 二.代码展开分析 构造链 …

appium解锁android真机系统的屏幕

在使用appium进行app自动化操作的过程中&#xff0c;经常遇到的第一个难题就是如何解锁系统屏幕&#xff0c;也就是亮屏解锁。 实际上解决办法如下&#xff1a;在desired_capabilities中增加两个参数unlockType和unlockKey&#xff0c;类似的示例代码如下&#xff1a; desire…

2024年腾讯云优惠政策_腾讯云服务器特价购买活动入口

腾讯云优惠活动2024新春采购节活动上线&#xff0c;云服务器价格已经出来了&#xff0c;云服务器61元一年起&#xff0c;配置和价格基本上和上个月没什么变化&#xff0c;但是新增了8888元代金券和会员续费优惠&#xff0c;腾讯云百科txybk.com整理腾讯云最新优惠活动云服务器配…

Express学习(二)

Express路由 路由的概念 现实生活中的 路由&#xff1a;例如我们在拨打10086的时候&#xff0c;会让我们按指定的按键选择对应的服务&#xff0c;这里的路由就是按键和服务之间的映射关系。 Express中的路由 在Express中&#xff0c;路由指的是客户端的请求与服务器处理函数…

基于STC系列单片机实现PNP型三极管S8550驱动共阳数码管或NPN型三极管S8050驱动共阴数码管功能

Digitron.c #include "Digitron.h" //#include "Key.h" #define uchar unsigned char//自定义无符号字符型为uchar #define uint unsigned int//自定义无符号整数型为uint //uchar code DigitronBitCodeArray[] = {0x01,0x02,0x04,0x08,0x10,0x20,0x40,0x…

AOP理解

AOP就是面向特定的方法进行编程&#xff0c;在不改动原始方法的基础上&#xff0c;可以增强原始方法的功能&#xff0c;或者改变某些功能&#xff0c;我们可以通过AOP记录数据库的操作日志 AOP的底层实现就是动态代理技术&#xff0c;在执行原始方法前&#xff0c;生成一个代理…

【Linux】开始使用gdb吧!

开始使用gdb吧&#xff01; 1 下载安装2 开始使用3 实践运用补充一下 print 的 功能 &#xff08;类似监视窗口的作用&#xff09;和显示堆栈的功能Thanks♪(&#xff65;ω&#xff65;)&#xff89;谢谢阅读&#xff01;&#xff01;&#xff01;下一篇文章见&#xff01;&am…

JavaScript基础4之原型的原型继承、原型链和理解对象的数据属性、访问器属性

JavaScript基础 原型原型继承问题解决 原型链isPrototypeOf()Object.getPrototypeOf() 理解对象数据属性访问器属性 原型 原型继承 继承是面向对象编程的另一个特征&#xff0c;通过继承进一步提升代码封装的程度&#xff0c;JavaScript中大多是借助原型对象实现继承的特性。…

计算机基础专升本笔记十四-计算机网络基础(一)

计算机基础专升本笔记十四-计算机网络基础&#xff08;一&#xff09; 一、计算机网络的发展历程 第一代计算机网络&#xff08;数据通信&#xff09; 以数据通信为主的第一代计算机网络。主要是指美国军方用于防控系统的一种联机系统。它只是计算机网络的雏形。 第二代计算…

2022年浙江省职业院校技能大赛信息安全管理与评估 理论题答案

培训、环境、资料 公众号&#xff1a;Geek极安云科 网络安全群&#xff1a;775454947极安云科专注于技能提升&#xff0c;赋能 2024年广东省高校的技能提升&#xff0c;在培训中我们的应急响应环境 成功押题成功&#xff0c;知识点、考点、内容完美还原大赛赛题环境&#xff0c…

比肩Gen-2,全新开源文生视频模型

著名开源平台Stability.ai在官网宣布&#xff0c;推出全新文生视频的扩散模型Stable Video Diffusion&#xff0c;已开源了该项目并公布了论文。 据悉&#xff0c;用户通过文本或图像就能生成高精准&#xff0c;14帧和25帧的短视频。目前&#xff0c;Stable Video Diffusion处…

Vue+SpringBoot打造校园电商物流云平台

目录 一、摘要1.1 项目介绍1.2 项目录屏 二、功能模块2.1 数据中心模块2.2 商品数据模块2.3 快递公司模块2.4 物流订单模块 三、系统设计3.1 用例设计3.2 数据库设计3.2.1 商品表3.2.2 快递公司表3.2.3 物流订单表 四、系统展示五、核心代码5.1 查询商品5.2 查询快递公司5.3 查…