手把手教你JavaScript编程（1）：写一个简单的网页

我之前已经和大家分享了CodeMonkey的过关教程。CodeMonkey的卡通画面非常吸引孩子，是一个很好的入门编程的教育类游戏。不过，为了让孩子得到更大的提升，学习一门实用的计算机语言是必不可少的。现在的编程语言有很多，比如Matlab，Python，C/C++等属于在科研领域使用比较广泛的语言，Python，C/C++，Java，JavaScript是属于在工业界广泛使用的语言，近几年比较热门的Lua，Julia也是一些比较不错的选择。不过我在这一系列教程里，会介绍JavaScript语言这一普遍使用而上手难度相对很容易的编程语言。另外，JavaScript被广泛应用在绝大多数网站和浏览器里面，所以其“所写即所见”的特性非常适合作为孩子初期学习的编程语言。

一个例子

我用一个例子来给大家一个初步的感觉，能引起大家对JavaScript的学习兴趣就最好了。 

JavaScript最基本的功能就是生成文本，比如下面这段JavaScript代码

会产生如下的网页效果：

我们只需要更改document.write("Hello World!")这行代码里的"Hello World!"，就可以生成不同的文本，非常简单，都不需要懂的上述代码里的那些指令。大家如果有兴趣，可以在W3School网站的这里（http://www.w3school.com.cn/tiy/t.asp?f=jseg_text）尝试写不同的文本。

JavaScript：写入 HTML 输出

document.write("")是写入HTML的输出文本的指令，我们可以在""里写入任何我们想写的文本。

比如document.write("

This is a heading

");写的是一个标题（heading），“

”表明标题开始，后面写入标题，“

”表明标题结束，其实“/”放在h1前面就表示标题结束，有一种“停”的意思。其效果如下：

This is a heading

再比如document.write("

This is a paragraph

");是一个段落（paragraph）的例子，“

”

表明段落开始，后面写入文字，这些文字被浏览器或者网页认为是一段话，和我们学习语文里的写作的时候是一样的。“

”和前面的“”类似，表明段落的结束。这行代码的效果如下：

This is a paragraph

大家可以在http://www.w3school.com.cn/tiy/t.asp?f=js_intro_document_write学习更复杂的例子，也可以尝试写出自己的标题和段落。例子如下：

代码：

解释：“<！DOCTYPE html>”表明所写的代码类型是html网页，

网页效果：

这样的例子看起来未免有点无趣，我们可以根据我们的需要修改里面的文字，比如家长们如果想和孩子一起建一个自己家庭的个人网页，那么可以这样写代码：

输出效果如下：

今天的教程就到这里，我们初步感受了JavaScript在网页编辑里的强大，下次我们会继续学习JavaScript的其他功能。