JavaScript综述
JavaScript在1995年由Netscape公司的Brendan Eich设计实现而成。
JavaScript的标准是ECMAScript,截至 2012 年,所有浏览器都完整的支持ECMAScript 5.1,旧版本的浏览器至少支持ECMAScript 3 标准。2015年6月17日,ECMA国际组织发布了ECMAScript的第六版,该版本正式名称为 ECMAScript 2015,但通常被称为ECMAScript 6 或者ES2015。
JavaScript包括:
- ECMAScript(语言标准)
- DOM(Document Object Model,文档对象模型)
- BOM(Browser Object Model,浏览器对象模型)
script元素
将JavaScript代码插入HTML的主要方法是使用<script>元素。
src:可选,表示包含要执行的代码的外部文件URI。
指定了src属性的script元素标签内不应该再有嵌入的脚本。--MDN
试验同时外联和内嵌js代码:外联生效,内嵌代码不再生效。
async:可选,表示应该被异步加载,立即开始下载脚本,但是不能阻止其他页面动作,比如下载资源或等待其他脚本加载。只对外部脚本文件有效。
defer:可选,表示脚本可以延迟到文档完全被解析和显示之后再执行。只对外部脚本文件有效。
HTML代码行内
<a href="javascript:alert('Google')" onclick="alert('Google')">Google</a>
script标签中
<script>js代码</script>
引入外部文件
<script src="./google.js"></script>
注意:
HTML元素和CSS属性是不区分大小写的,但是JavaScript代码严格区分大小写
之前script标签中会有type属性,即<script type='text/javascript'>,现在不再需要,因为JavaScript是所有现代浏览器以及HTML5中的默认脚本语言
推荐将script标签放于body元素的最后,因为JavaScript代码(script标签)同样遵循HTML文档自上而下的加载顺序
过去:所有的<script>元素都被放在HTML文档的<head>标签中,这种做法是为了将外部加载的CSS和JavaScript文件都集中在一起,但是由于页面在浏览器解析到<body>的起始标签时才开始渲染,这就意味着必须把所有的JavaScript代码都下载、解析和解释完成后才能开始渲染页面,这对于需要很多JavaScript的页面会导致页面渲染明显延迟,在此期间浏览器窗口完全空白。
现在:推荐将<script>元素放在<body>元素中的页面内容后面,这样页面会在处理JavaScript代码之前完全渲染页面。
早期noscript元素的出现是为了解决部分浏览器不支持JavaScript的问题,虽然目前浏览器已经100%支持JavaScript,但noscript元素对于禁用JavaScript的浏览器来说依旧有用
当浏览器不支持JavaScript或者是支持脚本的功能被关闭时,可以使用<noscript>元素给不支持JavaScript的浏览器提供替代内容。
<!DOCTYPE html>
<html lang='en'>
<head>
<meta charset='UTF-8'>
<title>noscript的使用</title>
</head>
<body>
<noscript>当浏览器不支持脚本或对脚本的支持被关闭时我会显示</noscript>
</body>
</html>