Question

我需要在运行时在我的网络应用上创建一个新的数字。我使用的是javascript和html / css。我要创建的元素如下：

<figure id = "myImage" class="ball" >
    <span class="shadow">
    </span>
</figure>

我尝试了一些标签名称，但未创建“球”。以下代码是一个例子（不工作）是什么问题？

var generatedBall = document.createElement("FIGURE");
generatedBall.class = 'ball';
generatedBall.style.background = 'yellow';
document.body.appendChild(generatedBall);

感谢您的帮助。

Answer 1

这对我有用，请看我的fiddle。

你必须给它高度;

var generatedBall = document.createElement("figure");
generatedBall.classList.add('ball'); //Edited this 
generatedBall.style.background = 'yellow';
generatedBall.style.height = '100px'; //Added bit
document.body.appendChild(generatedBall);

Answer 2

查看此页面上的确切输出See Here

＆＃13;

var innerSpan = document.createElement('span');
innerSpan.classList.add('shadow');
var generatedBall = document.createElement('figure');
generatedBall.setAttribute("id","myImage")
generatedBall.classList.add('ball');
document.body.appendChild(generatedBall);
generatedBall.appendChild(innerSpan);

＆＃13;

Answer 3

Element没有class属性。相反，您可以使用classList添加和删除类。所以你的例子将成为：

var generatedBall = document.createElement('figure');
generatedBall.classList.add('ball');
generatedBall.style.background = 'yellow';
document.body.appendChild(generatedBall);

使用函数javaScript函数createElement（tagName）创建图形

3 个答案: