作者kumadesu (kuma)
看板Web_Design
标题[问题] console.log element object与预想不符
时间Sun May 27 15:55:56 2018
请各位先看以下例子
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Plants</title>
</head>
<body>
<h1>Green Planet</h1>
<p id="greenplanet">All is well</p>
<h1>Red Planet</h1>
<p id="redplanet">Nothing to report</p>
<h1>Blue Planet</h1>
<p id="blueplanet">All systems A-OK</p>
<script>
var planet = document.getElementById("greenplanet");
console.log(planet.innerHTML);
console.log(planet); //why is not <p id="greenplanet">All is well</p>
planet.innerHTML = "Red Alert: hit by phaser fire!";
console.log(planet.innerHTML);
</script>
</body>
</html>
我的问题是就在注解那里
第二句console.log 在innerHTML之前 当我使用console.log不应是出现
<p id="greenplanet">All is well</p> 吗
为什麽会出现<p id="greenplanet">Red Alert: hit by phaser fire!</p>?
--
※ 发信站: 批踢踢实业坊(ptt.cc), 来自: 210.6.146.71
※ 文章网址: https://webptt.com/cn.aspx?n=bbs/Web_Design/M.1527407759.A.332.html
1F：→ mirtac: console.log出来的是一个物件，当它内容改变，console会跟 05/27 16:24
2F：→ mirtac: 着变，你可以试试下中断点一行一行执行，你会看到他改变 05/27 16:24
3F：→ mirtac: 如果你是用某些console, 他应该会出现[object] 05/27 16:28
4F：→ kumadesu: 所以说浏览器是的运作方式 先看完整过网页 建构DOM 05/29 19:55
5F：→ kumadesu: 然後做完所有的指令再输出结果? 05/29 19:55
6F：推 eight0: 这和 DOM 无关。console 渲染时你的程式已经执行完毕，那 05/29 21:21
7F：→ eight0: 时 planet 的内容已经是改变过的。如一楼所说，如果你在 05/29 21:21
8F：→ eight0: 改变之前把程式暂停，就会看到改变前的。 05/29 21:22