[笔记]《JavaScript高级程序设计》- 在HTML中使用JavaScript

一、<script>元素

像HTML页面中插入JavaScript的主要方法,就是使用<script>元素。HTML4.0.1为<script>定义了下列6个属性。

  • async:可选。表示应该立即下载脚本,但不应妨碍页面中的其他操作,比如下载其他资源或等待加载其他脚本。只对外部脚本有效。
  • charset:可选。表示通过src属性指定的代码的字符集。
  • defer:可选。表示脚本可以延迟到文档完全被解析和显示之后再执行。只对外部脚本有效。
  • src:可选。表示包含要执行代码的外部文件。
  • type:可选。表示编写代码使用的脚本语言的内容类型(也称MIME类型)。

带有src属性的<script>元素不应该在其<script>和</script>标签之间包含额外的JavaScript代码。如果包含了嵌入的代码,则只会下载并执行外部脚本文件,嵌入的代码会被忽略。

补充:defer和async的区别:

1)<script src="script.js"></script>

没有defer或async,浏览器会立即加载并执行指定的脚本,“立即”指的是在渲染该script标签之下的文档元素之前,也就是说不等待后续载入的文档元素,读到就加载并执行。

2)<script src="script.js"></script>

有async,加载和渲染后续文档元素的过程将和script.js的加载与执行并行进行(异步)。

3)<script src="script.js"></script>

有defer,加载后续文档元素的过程将和script.js的加载并行(异步),但是script.js的执行要在所有元素解析完成之后,DOMContentLoaded事件触发之前完成。

然后从使用角度来说,首先把所有脚本都丢到</body>之前是最佳实践,因为对于旧浏览器来说这是唯一的优化选择,此法可保证非脚本的其他一切元素能够以最快的速度得到加载和解析。

二、<noscript>元素

为了解决浏览器不支持JavaScript时如何让页面平稳地退化的问题,创造了<noscript>元素。<noscript>元素中的内容在下列情况下会显示出来:

  • 浏览器不支持脚本;
  • 浏览器支持脚本,但脚本被禁用。

原文地址:https://www.cnblogs.com/SyMind/p/8279666.html

时间: 2024-11-08 06:20:01

[笔记]《JavaScript高级程序设计》- 在HTML中使用JavaScript的相关文章

JavaScript高级程序设计-(1)html中使用JavaScript

html中使用JavaScript 1.延迟脚本 script标签定义了defer属性,脚本会被延迟到整个页面都解析完毕后运行 详细内容如下: 2.异步脚本 script标签定义了async属性,async适用于外部脚本文件,告诉浏览器立即下载文件,标记async脚本并不保存按照指定顺序执行 详细内容如下:

2. javacript高级程序设计-在HTML中使用JavaScript

1.1 <script>元素 向HTML页面中插入JavaScript的主要方法,就是使用<script>元素,<script>元素定义了一下6个元素: (1). async:可选,表示立即下载脚本,只对外部脚本文件有效 (2). charset:可选,表示通过src属性指定的代码的字符集 (3). defer:可选,表示脚本可以延迟到文档完全被解析和显示之后再执行,只对外部脚本文件有效 (4). language:已废弃,原来用于表示编写代码使用的脚本语言 (5).

Javascript高级程序设计(书中总结)

注:本文属于个人总结,知识点说的不全.不对的地方,还望见谅.(我会在日后修改,补正) 本书:js的简介以及在html中的使用就略过.(直奔基础语法,期间还有滤过部分) 第三章:基本概念: 1.js中的一切(变量.函数名和操作符)都区分大小写; 2.标识符,就是指变量.函数.属性的名字,或者函数的参数.标识符可以是按照下列格式规则 组合起来的一或多个字符: (1) 第一个字符必须是一个字母.下划线(_)或一个美元符号($): (2)其他字符可以是字母.下划线.美元符号或数字. 3.语句: var

JavaScript高级程序设计学习笔记--基本概念

1.语句 ECMAScript中的语句以一个分号结尾:如果省略分号,则由解析器确定语句的结尾,如下例所示: var sum=a+b //即使没有分号也是有效的语句--推荐 var diff=a-b; //有效的语句--推荐 虽然语句结尾的分号不是必需的,但我们建议任何时候都不要省略它.两个原因:1.加上分号可以避免很多错误 2.加上分号也会在某些情况下增进代码的性能,因为这样解析器就不必再花时间 推测应该在哪里插入分号了. 2.变量 var message="hi"; 像这样初始化变量

《Javascript高级程序设计》读书笔记之对象创建

<javascript高级程序设计>读过有两遍了,有些重要内容总是会忘记,写一下读书笔记备忘 创建对象 工厂模式 工厂模式优点:有了封装的概念,解决了创建多个相似对象的问题 缺点:没有解决对象识别问题,所有对象都仅是Object的实例 function createPerson(name,age,job) { var o=new Object(); o.name=name; o.age=age; o.job=job; o.sayName=function(){ alert(this.name)

JavaScript高级程序设计学习笔记--错误处理与调试

try-catch语句 只要代码中包含finally子句,则无论try或catch语句块中包含什么代码--甚至return语句,都不会阻止finally子句的执行,来看下面这个函数: function testFinally(){ try{ return 2; }catch(error){ return 1; }finally{ return 0; } } 调用这个函数会返回0(PS:但我实际执行的时候会先返回0,再返回2) 抛出错误 与try-catch语句相配的还有一个throw操作符,用于

JavaScript高级程序设计学习笔记--面向对象程序设计

工厂模式 虽然Object构造函数或对象字面量都可以用来创建单个对象,但这些方式有个明显的缺点:使用同一个接口创建很多对象,会产生大量的重复代码.为解决这个问题,人们开始使用 工厂模式的一种变体. function createPerson(name,age,job){ var o=new Object(); o.name=name; o.age=age; o.job=job; o.sayName=function(){ alert(this.name); }; return o; } var

javascript高级程序设计——笔记

javascript高级程序设计--笔记 基本概念 基本数据类型包括Undefined/Null/Boolean/Number和String 无须指定函数的返回值,实际上,未指定返回值的函数返回的是一个特殊的undefined值 变量.作用域和内存问题 基本类型值在内存中占据固定大小的空间,因此保存在栈内存中 引用类型的值是对象,保存在堆内存中 确定一个值是哪种基本类型用typeof,确定一个值是哪种引用用instanceof 所有变量都存在于一个执行环境当中,这个执行环境决定了变量的生命周期,

Javascript高级程序设计学习笔记

3. 基本概念 基本数据类型:Undefined,Null,Boolean,Number,String. 复杂数据类型:Object. 3.6 语句 switch比较值时用的是全等运算符 “===” ,因此不会进行类型转换.例如 “10” 不等于10. 3.7 函数 ECMAScript函数不介意传递进来多少个参数,也不在乎参数的类型.即使定义的函数只接受两个参数,在调用的时候也可以传递任意多个或者0个.因为ECMAScript的参数在内部是用一个数组表示的,在函数体内部可以通过argument

JavaScript高级程序设计 - 阅读笔记

(本博客为原创:http://www.cnblogs.com/HeavenBin/) 前言: 大致花费了一个星期的时间把这本书认真看了半本,下面是我做的阅读笔记,希望能够让看这本书的人有个大致的参考.目前可能写得较乱不够全面,后续我会整理添加.(2017-7-17) 第一章 JavaScript简介 第二章 HTML中使用JavaScript 第三章  基本概念 3.1.语法 区分大小写 标识符(建议用驼峰大小写myCar) 注释// /**/ 严格模式(use strict) 语句 建议var