1 什么是JavaScript?
JavaScript 是世界上最流行的脚本语言。
JavaScript 是属于 web 的语言,它适用于 PC、笔记本电脑、平板电脑和移动电话。
JavaScript 被设计为向 HTML 页面增加交互性。
许多 HTML 开发者都不是程序员,但是 JavaScript 却拥有非常简单的语法。几乎每个人都有能力将小的 JavaScript 片段添加到网页中。
1995 年,Netscape (网景) 公司,为了是解决页面验证总是需要提交到服务器端的问题,引入了JavaScript.
JavaScript 是一种简单却又复杂,轻量级但是很强大的,容易上手却又难以掌握的语言。-- 说人话就是,很好很强大,很黄很暴力!
2 JavaScript 和 Java 是什么关系?
除了名字里都有一个Java 外,没有一毛钱的关系。
JavaScript 之前在NetScape 公司称之为LiveScript, 在1995年,Netscape Navigator 2 发布时,为了迎合当时风骚独领,如日中天的 Java 编程语言,名字改为 JavaScript.
三十年河东,三十年河西呀!现在 JavaScript 的风头已经盖过了 Java.
忽然想到了,青梅煮酒论英雄?当年 Java 对 JavaScript 说,问天下英雄唯JavaScript与Java 耳。如今看来,方知古人诚不欺也!
3 什么是DOM?
DOM—Document Object Model –文档对象模型, DOM 是W3C 的标准,定义了访问HTML 和 XML 文档的标准。
HTML DOM 定义了访问和操作 HTML 文档的标准方法。
DOM 以树结构表达 HTML 文档。
4 如何在HTML 文件中引入 JavaScript?
<script> 标签。
属性 |
HTML5 新增? |
必须 |
值 |
描述 |
可以忽略的话 |
type |
否 |
是 |
text/javascript |
指示脚本的 MIME 类型。 |
MIME (Multipurpose Internet Mail Extensions) 多用途互联网邮件扩展类型。是设定某种扩展名的文件用一种应用程序来打开的方式类型,当该扩展名文件被访问的时候,浏览器会自动使用指定应用程序来打开。
|
async |
是 |
否 |
async |
规定异步执行脚本,仅适用于外部脚本 |
async 不保证脚本按顺序执行。 加载和渲染后续文档元素的过程将和 |
defer |
否 |
否 |
defer |
规定是否对脚本执行进行延迟,直到页面加载为止。 |
defer 指定了脚本不能改变页面结构,所以脚本才能够在整个页面解析后执行。
有 defer,加载后续文档元素的过程将和 script.js 的加载并行进行(异步),但是 script.js 的执行要在所有元素解析完成之后,DOMContentLoaded 事件触发之前完成。
|
src |
否 |
否 |
URL |
规定外部脚本文件的 URL |
|
charset |
否 |
否 |
charset |
规定在外部脚本文件中使用的字符编码 |
Unicode,ANSIII |
5 在<head> 与</body> 之前引用脚本的区别?
位置 |
代码 |
解析 |
<head> 中 |
<head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <script type="text/javascript"> alert(document.getElementsByTagName("li").length); </script> <title>purchase list</title> </head> <body> <h1>What to buy</h1> <ul id="purchases"> <li> beans</li> <li>Cheese</li> </ul> </body> 结果:0 |
<head> 中的<script> 在页面开始展现之前(页面展现开始与浏览器到达<body>标签)被下载,解析,编译。 |
</body> 之前 |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>Shopping list</title> </head> <body> <h1>What to buy</h1>
<ul id="purchases"> <li>Cheese</li> <li>Milk</li> <script type="text/javascript"> alert(document.getElementsByTagName("li").length); </script> </ul> </body> 结果:2 |
使用这种方式,在JavaScript脚本页面已经被浏览器展现出来。 |
<script> 放在<body></body> 中,</body>之前提高了用户体验,从上表可以看出,如果放在<head></head> 中的script 很大很多会使得浏览器再没有解析完脚本之前一片空白,而用户通常是没有耐心的,所以把脚本放在</body> 之前提高了用户体验。
相反CSS 相关的文件却要放在 <head> 中,因为我们希望展现给用户一个美观的界面。
这就好像一个男人绝对不会因为女人化妆耽误了一点时间而发脾气一样,他们希望看到美女!
废话:
如果说页面是一个女生,那么 HTML 说表示的内容就是她的身材,相貌,三围等先天条件,这从根本上决定了网页的是女神还是女汉子—在这个以貌取人的年代,没什么比这个更重要了!
CSS 就是化妆品,首饰,衣服,鞋子,最重要的它是 Photoshop, 它可以化腐朽为神奇,让凤姐变成林志玲。
JavaScript 是内在气质,品格,待人接物的方式。
6 如何检测浏览支持JavaScript?
<noscript>
<noscript> <p>This page requires a JavaScript-enabled browser.</p> </noscript>