【JS】我的JavaScript学习之路(2)

3.从JavaScript页面解析过程看执行顺序

代码(test.html)：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/><title>ch1_example2</title></head><body bgcolor="WHITE"><p>Paragraph 1</p><script type="text/javascript" language="JavaScript">// Script block 1
            alert("First Script Block");</script><p>Paragraph 2</p><script type="text/javascript" language="JavaScript">// Script block 2
            document.bgColor = "RED";alert("Second Script Block");</script><p>Paragraph 3</p></body>
</html>

执行后是这个样子滴。

第一步：

第二步：

第三步：

由此看出，页面解析是自上而下执行的，没有异步，在提示框弹出时，页面是暂停的，而没有去后台执行。

4.用JavaScript将信息写在网页上
接下来我们仅仅使用JavaScript来将“Hello World！”写入空白页面

代码(test2.html)：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/><title>ch1_example3</title></head><body><p id="ResultP"></p><script type="text/javascript" language="JavaScript">// Script block 1
            document.getElementById('ResultP').innerHTML = 'Hello World';</script></body>
</html>