001_JS基础_JavaScript简介-CSDN博客

1.1 历史

JS的发展历史:

http://www.w3school.com.cn/js/pro_js_history.asp

1.2 JavaScript简介

以下摘自维基百科对javascript的介绍：

JavaScript，一种高级编程语言，通过解释执行，是一门动态类型，面向对象（基于原型）的解释型语言[4]。它已经由ECMA（欧洲电脑制造商协会）通过ECMAScript实现语言的标准化[4]。它被世界上的绝大多数网站所使用，也被世界主流浏览器（Chrome、IE、FireFox、Safari、Opera）支持。JavaScript是一门基于原型、函数先行的语言[5]，是一门多范式的语言，它支持面向对象编程，命令式编程，以及函数式编程。它提供语法来操控文本、数组、日期以及正则表达式等，不支持I/O，比如网络、存储和图形等，但这些都可以由它的宿主环境提供支持。虽然JavaScript与Java这门语言不管是在名字上，或是在语法上都有很多相似性，但这两门编程语言从设计之初就有很大的不同，JavaScript的语言设计主要受到了Self（一种基于原型的编程语言）和Scheme（一门函数式编程语言）的影响[5]。在语法结构上它又与C语言有很多相似（例如if条件语句、while循环、switch语句、do-while循环等）[6]。在客户端，JavaScript在传统意义上被实现为一种解释语言，但在最近，它已经可以被即时编译（JIT）执行。随着最新的HTML5和CSS3语言标准的推行它还可用于游戏、桌面和移动应用程序的开发和在服务器端网络环境运行，如Node.js。

1.3 打印出HelloWorld

应该这么讲，学习任何一门语言的第一步都是先了解了它的打印输出语句，我们可以通过打印输出做很多测试，那我们如何使用在浏览器中打印出“Hello World”呢，有如下三种方式：

/*
*alert()用于弹出一个警告框
*/
alert("Hello World");
		
/*
* document.write()用户向网页页面中输入内容
*/
document.write("Hello World"); /* *向控制台（在开发者工具中）输入内容 */ console.log("hello World");

将以上js语句写入<script></script>标签对中，便可以执行，并且注意js语句是从上到下，一句一句的执行。

1.4 JS的编写位置

将JS代码编写到标签的onclick属性中，当我们点击标签元素时，执行js代码；
将JS代码卸载超链接的href属性中，当点击超链接时，执行js代码；

    <!DOCTYPE html>
    <html>
    <head> <meta charset="utf-8" /> <title></title> </head> <body> <!-- onclick属性中直接添加js代码，注意由于外层有双引号，js语句中若有使用引号的地方便使用单引号。 --> <button onclick="alert('js代码执行成功！');">Click me</button> <!-- javascript:是表示在触发默认动作时，执行一段JavaScript代码，而 javascript:; 表示什么都不执行，这样点击时就没有任何反应。 --> <a href="javascript:alert('js代码执行！')">点击</a> <a href="javascript:;">点击</a> </body> </html>

注意以上两种方式都写在了标签的属性中，属于结构与行为耦合，不方便维护，类似于将CSS样式写入标签内部，不推荐使用。
您可以在 HTML 文档中放入不限数量的脚本。脚本可位于 HTML 的 <body> 或 <head> 部分中，或者同时存在于两个部分中。通常的做法是把函数放入<head> 部分中，或者放在页面底部。这样就可以把它们安置到同一处位置，不会干扰页面的内容。

将js代码写在<script></script>标签里面；
将js代码编写到外部js文件中，然后通过script标签引入；写到外部文件中，可以在不同页面中引用同一个js文件，也可以利用浏览器的缓存机制等，所以推荐使用这种方式；

注意： script标签一旦用于引入外部文件后，就不能在编写代码了，即使编写了也会被浏览器忽略，如果需要在html文件内部编写js代码，则在重新写一个新的script标签；

<!DOCTYPE html>
<html>
<head> <meta charset="utf-8" /> <title></title> <!-- 外部链接js文件 --> <script type="text/javascript" src="js/test.js"></script> <!-- 重新写一个script标签 --> <script type="text/javascript"> document.write("html文档内部的js") </script> </head> <body> </body> </html>