wow*_*wow 222 javascript dom
如何为div？添加一个类？
var new_row = document.createElement('div');
Dar*_*o Z 394
new_row.className = "aClassName";
关于MDN的更多信息: className
Sun*_*S.M 27
这是使用函数方法的工作源代码.
<html>
<head>
<style>
.news{padding:10px; margin-top:2px;background-color:red;color:#fff;}
</style>
</head>
<body>
<div id="dd"></div>
<script>
(function(){
var countup = this;
var newNode = document.createElement('div');
newNode.className = 'textNode news content';
newNode.innerHTML = 'this created div contains class while created!!!';
document.getElementById('dd').appendChild(newNode);
})();
</script>
</body>
</html>
Mic*_*ski 27
使用.classList.add()方法:
const element = document.querySelector('div.foo');
element.classList.add('bar');
console.log(element.className);<div class="foo"></div>此方法更好地覆盖className属性,因为它不会删除其他类,并且如果元素已经拥有它,则不会添加该类.
您还可以使用切换或删除类element.classList(请参阅MDN文档).
Has*_*örk 14
在JavaScript中还有DOM方式:
// Create a div and set class
var new_row = document.createElement("div");
new_row.setAttribute("class", "aClassName" );
// Add some text
new_row.appendChild( document.createTextNode("Some text") );
// Add it to the document body
document.body.appendChild( new_row );
小智 5
如果要创建很多元素，您可以创建自己的基本 createElementWithClass 函数。
function createElementWithClass(type, className) {
const element = document.createElement(type);
element.className = className
return element;
}
我知道的非常基本，但是能够调用以下内容就不那么混乱了。
const myDiv = createElementWithClass('div', 'some-class')
相对于很多
const element1 = document.createElement('div');
element.className = 'a-class-name'
一遍又一遍。
| 归档时间： |
|
| 查看次数： |
321147 次 |
| 最近记录： |