1 HTML基础
大部分HTML标签是闭合的,由开始标签和结束标签构成,二者之间是要显示的内容,例如:
和
。
(1)h标签
在HTML代码中,使用h1到h6表示不同级别的标题,其中h1级别的标题字体最大,h6级别的标题字体最小。该标签的用法为:
一级标题
二级标题
三级标题
(2)p标签
在HTML代码中,p标签表示段落,用法为:
这是一个段落
(3)a标签
在HTML代码中,a标签表示超链接,使用时需要指定链接地址(由href属性来指定)和在页面上显示的文本,用法为:
(4)img标签
在HTML代码中,img标签用来显示一个图像,并使用src属性指定图像文件地址,可以使用本地文件,也可以指定网络上的图片。例如:


(5)table、tr、td标签
在HTML代码中,table标签用来创建表格,tr用来创建行,td用来创建单元格,用法为:
| 第一行第一列 | 第一行第二列 |
| 第二行第一列 | 第二行第二列 |
(6)ul、ol、li
在HTML代码中,ul标签用来创建无序列表,ol标签用来创建有序列表,li标签用来创建其中的列表项。例如,下面是ul和li标签的用法:
- 红色
- 绿色
- 蓝色
(7)div标签
在HTML代码中,div标签用来创建一个块,其中可以包含其他标签,例如:
- 红色
- 绿色
- 蓝色
第一段
第二段
2 JavaScript基础
JavaScript是由客户端浏览器解释执行的弱类型脚本语言,大幅度提高网页的浏览速度和交互能力,提高了用户体验。
(1)在网页中使用JavaScript代码的方式
可以在HTML标签的事件属性中直接添加JavaScript代码。例如,把下面的代码保存为index.html文件并使用浏览器打开,单击按钮“保存”,网页会弹出提示“保存成功”。
对于较多但仅在个别网页中用到的JavaScript代码,可以写在网页中的这一对标签要放在
标签的后面,否则由于页面还没有渲染完,所以获取指定id的div会失败。document.getElementById("test").innerHTML="动态内容";
如果一个网站中会用到大量的JavaScript代码,一般会把这些代码按功能划分到不同函数中,并把这些函数封装到一个扩展名为js的文件中,然后在网页中使用。例如,和网页在同一个文件夹中的myfunctions.js内容如下:
function modify(){
document.getElementById("test").innerHTML="动态内容";
}
在下面的页面文件中,把外部文件myfunctions.js导入,然后调用了其中的函数:
(2)常用JavaScript事件
如果不在HTML代码中说明,那么在这两个标签的JavaScript代码在页面打开和每次刷新时都会得到运行,例如本节的第二段和第三段代码所演示。但有些JavaScript代码需要在特定的时机才可以运行,例如本节第一段代码,只有单击页面的按钮之后才会执行okClick属性指定的JavaScript代码,这种机制叫做事件驱动。得益于事件驱动机制,我们可以指定某段代码在什么情况下才会运行,例如页面加载时(onLoad事件)、鼠标单击时(onClick事件)、键盘按键时(onkeypress事件)等等。
把下面的代码保存为index.html并使用浏览器打开,会发现在每次页面加载时都会弹出提示,但在页面上进行其他操作时,并不会弹出提示。
除了常用的事件之外,还有一些特殊的方式可以执行JavaScript代码。例如,下面的代码演示了在链接标签中使用href属性指定JavaScript代码的用法。
function test(){alert('提示信息');}
(3)常用JavaScript对象
常用的JavaScript对象有navigator、window、location、document、history、image、form等等,这里简单介绍一下window和document对象的用法。
JavaScript对象window对象表示浏览器窗口,是所有对象的顶层对象,会在
或