如何使用JavaScript将字符放置在页面中的特定坐标上

Question

我试过这段代码：

var span = document.createElement('span')
span.style.position = 'absolute'
span.style.color = 'red'
span.style.left = 100
span.style.top = 100
span.innerHTML = '*'
document.body.insertBefore(span, document.body.firstChild)

但是这段代码仍然将星号定位在坐标（0,0）而不是（100,100）。这是一个jsfiddle网址：http://jsfiddle.net/E5NDV/

你能帮助我做到这一点吗？

Answer 1

var span = document.createElement('span')
span.style.position = 'absolute'
span.style.color = 'red'
span.style.left = "100px"
span.style.top = "100px"
span.innerHTML = '*'
document.body.insertBefore(span, document.body.firstChild)

http://jsfiddle.net/E5NDV/1/

Answer 2

left 和 top 的值应该是 String ，它给出一个数字和一个单位，例如{em>像素的px，即'100px'。节点被附加到哪个子节点对于绝对定位无关紧要，因为此信息不用于确定将其放置在何处，使用appendChild将与insertBefore一样有效。