javascript为什么这两个运行结果不同

<html>
<body>
<div id = "app"></div>
<script>
var d =document.getElementById("app")
var dic = []
for(var i=0;i<3;i++){
    var getid = document.createElement("div")
    getid.id = "div" + i
    d.appendChild(getid)
    dic.push( { turn : i , id : getid } )
}
dic[0].id.innerHTML = "hi"
</script>              
</body>
</html>

这个能正常运行

<html>
<body>
<div id = "app"></div>
<script>
var d =document.getElementById("app")
var dic = []
for(var i=0;i<3;i++){
    var getid = "<div id = 'div" + i + "'></div>"
    d.innerHTML += getid
    dic.push( { turn : i , id : getid } )
}
dic[0].id.innerHTML = "hi"
</script>              
</body>
</html>

这个却不行

上边的用 createElement 创建了一个对象,下边你给的空字符串,没有创建对象