1.2.1 准备开发工具
HTML文档本身也是一种文本,我们可以使用任何文本编辑器进行HTML文档的编写,只需要将其文本后缀名使用.html即可。使用一个强大的HTML编辑器可以极大地提高我们的编写效率,例如很多HTML编辑器都会提供代码提示、标签高亮、标签自动闭合等功能,这些功能都可以帮助我们在项目开发中十分快速地编写代码,并且可以有效减少因为笔误所产生的错误。
Visual Studio Code(VS Code)是一款非常强大的编辑器,其除提供语法检查、格式整理、代码高亮等基础编程功能外,还支持对代码进行调试和运行以及版本管理。通过安装扩展,VS Code几乎可以支持目前所有流行的编程语言。本书示例代码的编写也将采用VS Code编辑器完成。你可以在如下网站下载新版本的VS Code编辑器:
https://code.visualstudio.com
目前VS Code支持的操作系统有macOS、Windows和Linux,在网站中下载适合自己操作系统的VS Code版本进行安装即可,如图1-1所示。
下载并安装VS Code软件后,可以尝试使用其创建一个简单的HTML文档,新建一个名为test.html的文件,在其中编写如下测试代码:
图1-1 下载VS Code编辑器软件
【代码片段1-2 源码见附件代码/第1章/1.test.html】
相信在输入代码的过程中,你已经体验到使用VS Code编程带来的畅快体验,并且在编辑器中关键词的高亮和自动缩进也使代码结构看起来更加直观,如图1-2所示。
图1-2 VS Code的代码高亮与自动缩进功能
在VS Code中将代码编写完成后,可以直接运行,运行HTML的源文件时,VS Code会自动将其以浏览器的方式打开,选择VS Code工具栏中的Run→Run Without Debugging选项,如图1-3所示。
图1-3 运行HTML文件
之后会弹出环境选择菜单,可以选择一款浏览器进行预览,如图1-4所示。建议安装Google Chrome浏览器,其有很多强大的插件可以帮助我们进行Web程序的调试。
图1-4 使用浏览器进行预览
预览效果如图1-5所示。
图1-5 使用HTML实现的HelloWorld程序