《JavaScript高级程序设计》——第二章在HTML使用JavaScript
这章讲的是JavaScript在HTML中的使用,也就是<script>元素的属性。书中详细讲了async、defer、src和type四个<script>的属性。
下面是对第二章做的笔记
<script>元素
type:可选。表示编写代码的脚本语言的类型;属性的值一般是text/javascript。不过,这个属性不是必需的,如果没有指定这个属性,则其默认值仍为text/javascript。
<script type="text/javascript">
function sayHi(){
alert("Hi");
}
</script>
也就是说下面的代码和上面的是等价的
<!--type属性不是必需的,如果没有指示这个属性,则其默认值仍为这个text/javascript-->
<script>
function sayHi(){
alert('Hi');
}
</script>
在使用<script>嵌入JavaScript代码时,在任何地方出现"</script>"字符串都是错误的。
<script>
alert("</script>"); //这段代码是错误的
</script>
这个时候需要转义字符“\”来解决这个问题
<script>
alert("<\/script>"); //用转义字符“\”来解决这个问题
</script>
2、src:可选。属性的值是一个指向外部JavaScript的链接。
<script type="text/javascript" src="example.js"></script>
后面结束的</script>可以省略
<script type="text/javascript" src="example.js" />
标签的位置
在文档<head>元素中包含所有的JavaScript文件,意味着必须等到全部JavaScript代码都被下载解析和执行完成以后,才能开始呈现页面内容,这样会使浏览器呈现页面出现明显延迟。(浏览器遇到<bady>元素才开始呈现内容)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>《JavaScript高级程序设计》第二章</title>
<script type="text/javascript" src="example1.js"></script>
<script type="text/javascript" src="example2.js"></script>
</head>
<body>
<!--这里放内容-->
</body>
</html>
3、defer(延迟):可选。表示脚本可以延迟到文档完全被解析和显示之后再执行。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>《JavaScript高级程序设计》第二章</title>
<script type="text/javascript" defer="defer" src="example1.js"></script>
<script type="text/javascript" defer="defer" src="example2.js"></script>
</head>
<body>
<!--这里放内容-->
</body>
</html>
4、async(异步):可选。表示当前脚本不需要等待其他脚本,也不必阻塞文档呈现。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>《JavaScript高级程序设计》第二章</title>
<script type="text/javascript" async src="example1.js"></script>
<script type="text/javascript" async src="example2.js"></script>
</head>
<body>
<!--这里放内容-->
</body>
</html>
对脚本不太理解,下面是在百度搜的脚本简介
脚本(Script):是一种批处理文件的延伸,是一种纯文本保存的程序,一般来说的计算机脚本程序是确定的一系列控制计算机进行运算操作动作的组合,在其中可以实现一定的逻辑分支等。
脚本简单地说就是一条条的文字命令,这些文字命令是可以看到的(如可以用记事本打开查看、编辑),脚本程序在执行时,是由系统的一个解释器,将其一条条的翻译成机器可识别的指令,并按程序顺序执行。因为脚本在执行时多了一道翻译的过程,所以它比二进制程序执行效率要稍低一些。
2020-04-22 21:25:41
《JavaScript高级程序设计》——第二章在HTML使用JavaScript的更多相关文章
- javascript高级程序设计第二章知识点提炼
这是我整理的javascript高级程序设计第二章的脑图,内容也是非常浅显与简单.希望您看了我的博客能够给我一些意见或者建议.
- javascript高级程序设计第二章
看后总结: 1.js代码用得最多的两种加载方式: a)外部文件形式:<script type="text/javascript" src="jquery.min.j ...
- 读书笔记 - javascript 高级程序设计 - 第二章 在Html中使用JavaScript
1 <script>的6个属性 async 立即下载当前script标签的外部脚本 但不能影响别的 charset 没用了 defer 文档显示之后再执行脚本,只对外部脚本有效 lan ...
- javascript高级程序设计---第二、三章
在HTML中引用javaScript javascript的几个属性 type async(异步加载 只适用于外部JS且IE8以上 HTML5规范 先于load执行) src defer(延迟加载 ...
- JavaScript 高级程序设计第二版
20.4 部署 20.4.1 构建 构建过程始于在源控制中定义用于存储文件的逻辑结构.最好避免使用一个文件存放所有的JavaScript,遵循以下面向对象语言中的典型模式:将每个对象或自定义了类别分别 ...
- javascript高级程序设计第一章有感
第一章JavaScript简介 Javascript的诞生最早是为了处理表单数据验证的问题,以前主要是使用perl这个强大的服务端脚本语言处理的.在未诞生javascript之前, 人们每次提交表单就 ...
- javascript 高级程序设计1--14章重点总结
js简介 首先介绍了js是一种专门与网页交互而设计的脚本语言.主要由ECMAScript 文档对象模型(DOM) 浏览器对象模型(BOM)三部分组成.分别用来提供核心语言,提供访问和操作网页内容的方法 ...
- JavaScript 高级程序设计 第二版
function outputNumbers(count) { (function () { for (var i =0;i < count; i++) { ...
- javascript高级程序设计第一章
看后总结: 1.javascript的组成成分:ECMAscript+DOM+BOM
- 读书笔记 - javascript 高级程序设计 - 第一章 简介
第一章 简介 诞生时间 1995 最初用途 客服端验证 第一版标准 注意是标准 1997年 Ecma-262 一个完整的js实现由三部分组成 ECMAScript DOM 文档对象模型 BO ...
随机推荐
- 搭建实用深度学习环境(Ubuntu16.10+Theano0.8.2+Tensorflow0.11.0rc1+Keras1.1.0)
在动手安装之前,首先要确定硬件,系统,准备安装软件的版本,确定这些软硬件之间是否相互支持或兼容.本文安装的主要环境和软件如下: Ubuntu16.10+CUDA8.0(cudnn5.1,CNMEM)+ ...
- vue安装教程
Vue.js 安装教程 安装node.js https://nodejs.org/zh-cn/download/ 选择一个适合自己电脑的版本下载 下载成功, 直接安装, 全部点击下一步 然后输入 黑窗 ...
- 040 01 Android 零基础入门 01 Java基础语法 05 Java流程控制之循环结构 02 while循环的执行流程
040 01 Android 零基础入门 01 Java基础语法 05 Java流程控制之循环结构 02 while循环的执行流程 本文知识点:while循环的执行流程 三种循环结构中的第一种--wh ...
- 023 01 Android 零基础入门 01 Java基础语法 03 Java运算符 03 算术运算符之——自增自减运算符
023 01 Android 零基础入门 01 Java基础语法 03 Java运算符 03 算术运算符之--自增自减运算符 本文知识点:Java算术运算符中的自增自减运算符 自增自减运算符 之前我们 ...
- 03 以Hello World为例,分析C语言的最小的程序结构
C程序主要包含的部分 预处理器指令 函数 变量 语句 & 表达式 注释 C Hello World 实例 如下程序,可以在屏幕输出短句"Hello World" #incl ...
- 剑指Offer(一):二维数组中的查找
一.前言 刷题平台:牛客网 二.题目 在一个二维数组中,每一行都按照从左到右递增的顺序排序,每一列都按照从上到下递增的顺序排序.请完成一个函数,输入这样的一个二维数组和一个整数,判断数组中是否含有该整 ...
- 对do{ }while();一直以来的误解 -----如何理解do{ }while( );语句
在do{ }while( ); 语句中,我之前的理解是:先执行一次do{ },然后判断while( )中的内容,一般里面都是字符串或者数值作比较嘛,所以理解是:如果判断的这个东西,在这个范围中(等于这 ...
- 为了省钱,我用1天时间把PHP学了!
作者:小傅哥 博客:https://bugstack.cn 沉淀.分享.成长,让自己和他人都能有所收获! 一.前言 你在通往架构师的路上吗? 程序员这个行业就像是在不断的打怪升级,突破每一阶段的瓶颈期 ...
- linux配置定时任务cron/定时服务与自启动
实现linux定时任务有:cron.anacron.at,使用最多的是cron任务 名词解释 cron--服务名:crond--linux下用来周期性的执行某种任务或等待处理某些事件的一个守护进程,与 ...
- 多测师讲解自动化测试 _RF分配id_高级讲师肖sir
1.Assign Id To Element.