我试图通过一个非常简单的 JavaScript 示例来学习 JavaScript 中的流程,但是三种浏览器(Chrome、IE 和 Firefox)这三种浏览器都显示不同的流程模式和不同的最终结果。我知道会出现跨浏览器问题,但这个问题非常简单。所以我试图了解如何解释 JavaScript 的实际流程。
这是代码:
<!DOCTYPE html>
<html>
<head>
<title>Test 01</title>
<script type="text/javascript">
document.bgColor = "red";
</script>
</head>
<body bgColor="yellow">
<p>Paragraph 1</p>
<script>alert("after para 1");</script>
<p>Paragraph 2</p>
<script>alert("after para 2");</script>
<p>Paragraph 3</p>
<script>alert("after para 3");</script>
</body>
</html>
我看到的是,“第 1 段”文本在警报之后显示在 Chrome 中,依此类推,还有其他两个警报。 IE 和 Firefox 似乎在这里做了正确的事情 - 在警报之前显示文本。
在 IE 和 Firefox 之间,IE 的背景为红色,而 Firefox 的背景为黄色。所以不确定到底要解释什么......所有浏览器的行为都是不同的。
您如何了解这到底是如何工作的?
编辑:删除与此问题无关的 var x=10 。问题是如何解释在相关文本之前显示警报的 chrome 行为 - 以及为什么 bgcolor 在一种情况下被覆盖,而在其他情况下则不然。
最佳答案
欢迎来到浏览器中的 JavaScript 世界。跨浏览器的不同行为是可以预料的,而不是异常(exception)。
了解不推荐您的代码所做的事情应该会有所帮助。任何实际执行某些操作(例如警报)的 JavaScript 语句都应该只在关闭 body 标记之前出现。
当您不尊重这一点并尝试在浏览器仍在渲染页面时运行代码时,就会发生不好的事情。不过,在此之前您可以有任意数量的声明,只要它们在文档正文结束之前不会被调用。
关于javascript - 基本的 javascript 流程 - 在各种浏览器中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39059229/