Page 69 - 智慧地铁建设实践与创新研究

第二章 智慧地铁建设技术架构及关键技术

素永远位于 head 元素内部，没有元素内容，主要提供界面的元信息。title 元素
用来显示文档标题。link 元素中的 rel 属性是 stylesheet，说明当前文档使用的外
部样式表，href 属性说明文档使用的外部样式表的相对位置。body 元素中使用大

量的 div 元素将文档划分成不同的板块，div 开始标签中使用 class 属性来修饰当
前 div 元素内容的样式。之所以采用大量 div 元素，文档简洁有规律，保证了后
期便于修改、维护。
CSS 样式表有三种表达形式，分别是内联样式、内部样式表、外部样式表。

内联样式是在元素标签中直接添加 style 属性。内部样式表是在 head 元素里面使
用 style 标签独自设置格式。外部样式表是在 CSS 文档中声明各种不同的样式，
它是独立于 HTML 文档的。因为内联样式和内部样式表都只能在当前 HTML 文
档中发挥作用，无法实现一个样式多个使用的情况，所以采用外部样式表。外部
样式表可以在不同 HTML 文档中被引用，大大减少了开发时间与成本。在 CSS

文档中规定不同 html 元素内容的不同样式，本设计中主要使用了 id 选择器和
class 类选择器，两种选择器为标有各自属性（id 或 class）的 html 元素设置样式。
id 选择器使用“#”定义，class 选择器使用“.”定义。

JS 作为一种轻量级的编程语言，可以插入 HTML 界面并被浏览器执行，从
而实现改变界面信息的功能。JS 在 HTML 文档中位于 <script> 和 </script> 标签
之间，script 的位置代表了 JS 的开始位置。既然是一种编程语言，那么定义变量
是必然的。JS 中的变量包含很多类型，基本类型有字符串、数字、布尔等，引

用类型有对象、数组、函数等，使用关键字 var 进行变量声明。在本研究中，因
为语音售票过程中需要反馈出导航信息，所以 JS 中需要定义一个数组变量，该
变量包含了所有的地铁站点信息，每一个数组元素代表一个站点信息。站点信息
包含诸多信息，有站点中文名称、南京站点 ID、阿里约定 ID、站点英文名称、

站点中文名称拼音缩写、线路 ID、线路中文名称、线路英文名称、区域编号、
区域中文名称、区域中文名称拼音。
编程语言真正实现作用的是函数，函数对变量进行调用、处理、输出等操作。
JS 函数是由事件驱动或者被调用时执行的代码块，使用关键字 function 进行声明，

调用函数的名称必须与 JS 被调用函数名称完全相同（JS 对大小写敏感）。JS 能
够改变界面的机制是功能函数对后端传来的数据进行处理，将处理结果更新显示
在界面上。设计的功能函数说明见表 2-5，所有函数在语音状态界面中都有对应

·57·