如何通过单击onclick（）上附加了javascript的按钮来添加相同的元素（具有相同的id）（我目前没有JS）？我考虑过使用文档。写，然后只是添加一个div，但对我来说不起作用我听说这是一个糟糕的做法。
到目前为止，我有：
HTML:
<!DOCTYPE html/>
<html>
<head>
<title>wat</title>
<meta charset= "UTF-8">
<link rel="stylesheet" type="text/css" href="CssHtmlLapai.css">
<script src="JsLapai.js"></script>
</head>
<body>
<button type="button" onclick="NewDiv()">Click me</button>
<div id="first"></div>
</body>
</html>
CSS:
#first{
width: 100px;
height: 100px;
background-color: red;
}
使用document.createElement（tagName）执行此操作。
文件
function NewDiv() {
var newDiv = document.createElement("div");
document.getElementById("parentDivId").appendChild(newDiv);
}
我认为你要找的是在多个元素上应用相同的CSS。为此，您应该使用类而不是重复的ID。（ID本质上被用作标识符，如果你尝试有多个，javasript会做令人惊讶的事情）。
所以不用id，用class
<!DOCTYPE html/>
<html>
<head>
<title>wat</title>
<meta charset= "UTF-8">
<link rel="stylesheet" type="text/css" href="CssHtmlLapai.css">
<script src="JsLapai.js"></script>
</head>
<body>
<button type="button" onclick="NewDiv()">Click me</button>
<div class="first"></div>
</body>
</html>
要定义类，您将使用“.”前缀
.first{
width: 100px;
height: 100px;
background-color: red;
}
然后在JS中，你可以做这样的事情...
<script>
function NewDiv()
{
var newDiv = document.createElement("div");
newDiv.className = "first";
newDiv.id = "someotherid"; //not neccessary but probably useful
}
</script>
使用以下代码：
HTML:
<!DOCTYPE html/>
<html>
<head>
<title>wat</title>
<meta charset= "UTF-8">
<link rel="stylesheet" type="text/css" href="CssHtmlLapai.css">
<script src="JsLapai.js"></script>
</head>
<body>
<button type="button" id="click-me">Click me</button>
<div id="first" class="common-css"></div>
</body>
</html>
CSS:
.common-css{
width: 100px;
height: 100px;
background-color: red;
}
JavaScript:
document.getElementById('click-me').onclick = function() {
var newdiv = document.createElement('div');
var firstdiv = document.getElementById('first');
newdiv.setAttribute('class', 'common-css');
firstdiv.appendChild(newdiv);
};
JSIDLE链接：http://jsfiddle.net/vinoddalvi/u4H9h/
