【前端知识】JavaScript——<script>的8个属性

news/2025/2/22 15:49:50/

【前端知识】JavaScript——<script>的8个属性

<script>元素的8个属性:

属性释义
async表示应该立即开始下载脚本,但不能阻止其他页面动作,比如下载资源或等待其他脚本加载。只对外部脚本文件有效。
charset使用 src 属性指定的代码字符集。
crossorigin配置相关请求的CORS(跨源资源共享)设置。
defer表示脚本可以延迟到文档完全被解析和显示之后再执行。只对外部脚本文件有效。
integrity允许比对接收到的资源和指定的加密签名以验证子资源完整性(SRI,Subresource Integrity)。
language已废弃,最初用于表示代码块中的脚本语言。
src表示包含要执行的代码的外部文件。
type代替 language,表示代码块中脚本语言的内容类型(也称 MIME 类型)。
  1. 要包含外部 JavaScript 文件,必须将 src 属性设置为要包含文件的 URL。文件可以跟网页在同一台服务器上,也可以位于完全不同的域。

    image-20230717132705149

  2. 所有<script>元素会依照它们在网页中出现的次序被解释。在不使用 defer 和 async 属性的情况下,包含在<script>元素中的代码必须严格按次序解释。

  3. 对不推迟执行的脚本,浏览器必须解释完位于<script>元素中的代码,然后才能继续渲染页面的剩余部分。为此,通常应该把<script>元素放到页面末尾,介于主内容之后及</body>标签之前。

    image-20230717132828086

  4. 可以使用 defer 属性把脚本推迟到文档渲染完毕后再执行。推迟的脚本原则上按照它们被列出的次序执行。

  5. 可以使用 async 属性表示脚本不需要等待其他脚本,同时也不阻塞文档渲染,即异步加载。异步脚本不能保证按照它们在页面中出现的次序执行。

    image-20230717132928032

  6. 通过使用<noscript>元素,可以指定在浏览器不支持脚本时显示的内容。如果浏览器支持并启用脚本,则<noscript>元素中的任何内容都不会被渲染。


http://www.ppmy.cn/news/966239.html

相关文章

Python实现HBA混合蝙蝠智能算法优化BP神经网络分类模型(BP神经网络分类算法)项目实战

说明&#xff1a;这是一个机器学习实战项目&#xff08;附带数据代码文档视频讲解&#xff09;&#xff0c;如需数据代码文档视频讲解可以直接到文章最后获取。 1.项目背景 蝙蝠算法是2010年杨教授基于群体智能提出的启发式搜索算法&#xff0c;是一种搜索全局最优解的有效方法…

基于nginx的waf方案naxsi源码理解(7)_检测处理

模块处理函数挂载 ngx_http_naxsi_init 函数中&#xff1a; /* Register for rewrite phase */// 模块处理函数挂载: NGX_HTTP_REWRITE_PHASE 为 Location请求地址重写阶段h ngx_array_push(&cmcf->phases[NGX_HTTP_REWRITE_PHASE].handlers);if (h NULL)return (NG…

这是我认为目前ChatGPT最最最牛的prompt!

&#xff08;本文阅读时间&#xff1a;4分钟&#xff09; 这是国外的一个GPT玩家写的&#xff0c;整个指令的名称叫GigaGuider。 这个prompt的好处目前有几点&#xff1a; 输出的内容上&#xff1a; 充满丰富细节和步骤指导的详细、适用的建议。这些建议不仅具有启发性&#xf…

chatgpt赋能python:用Python改变图片颜色

用Python改变图片颜色 在数字化时代&#xff0c;图片已经成为了重要的沟通方式&#xff0c;无论是在社交媒体、广告还是推销中。但是&#xff0c;有时候我们需要一些新的创意&#xff0c;比如更改图片颜色。那么&#xff0c;如何用Python改变图片颜色呢&#xff1f; 准备工作…

如何在 Hexo Blog 网站上添加图标(iconfont 使用)

emsp; 因为在制作自己的个人主页的时候遇到了Hexo主题没有提供对应图标的问题&#xff0c;就查看了一下Hexo主题是如何添加图标的。发现主要的方法是直接修改fonts文件夹下的iconfont.svg文件。修改yilia theme下的font文件&#xff0c;这个也刚好是同学blog使用的主题&#x…

chatgpt赋能python:Python没有桌面图标:一个程序员的经验分享

Python没有桌面图标&#xff1a;一个程序员的经验分享 如果你是一个有着十年Python编程经验的程序员&#xff0c;那么你一定会知道Python在许多方面都是一个非常强大和灵活的编程语言。但是&#xff0c;如果你在编写Python代码时使用了桌面图标&#xff0c;你可能会感到有些困…

chatgpt赋能python:Python图标长什么样子?

Python图标长什么样子&#xff1f; 如果你是一名Python开发人员或一位正在学习Python编程语言的初学者&#xff0c;你可能已经熟悉了Python的图标。但是&#xff0c;你知道Python的图标长什么样子吗&#xff1f;在这篇文章中&#xff0c;我们将介绍Python的图标是什么&#xf…

【C++】面向对象三大特性之继承

【C】面向对象三大特性之继承 继承的概念继承基类成员访问方式的变化子类到父类对象之间赋值兼容转换继承中的作用域子类的默认成员函数继承和友元、静态成员的关系菱形继承和菱形的虚拟继承虚拟继承解决二义性和数据冗余 继承的概念 继承&#xff1a;是面向对象程序设计使代码…