例如,当我有:
<div class="abc123"></div> <!-- no child div -->
我想在其中插入一个新的 div:
<div class="xyz">some content</div>
所以结果是:
<div class="abc123">
<div class="abc">Some Content</div>
</div>
如何使用 javascript 实现这一点?
例如,当我有:
<div class="abc123"></div> <!-- no child div -->
我想在其中插入一个新的 div:
<div class="xyz">some content</div>
所以结果是:
<div class="abc123">
<div class="abc">Some Content</div>
</div>
如何使用 javascript 实现这一点?
在 jQuery 中:
$(".abc123").each(function() {
if (this.children(".abc").length == 0) {
$(this).append('<div class="xyz">some content</div>');
}
});
在简单的 JS
var divs = document.getElementsByTagName("div");
for (var i = 0; i < divs.length; i++) {
if (divs[i].childNodes.length == 0) { // testing if it has not child
var newdiv = document.createElement('div');
newdiv.innerHTML = "some content";
newdiv.className = "xyz";
divs[i].appendChild(newdiv);
}
}
编辑:
下面这段代码产生与上面提到的 jQuery 代码相同的效果(根据RobW的评论编辑):
var divs = document.getElementsByClassName("abc123");
for (var i = 0; i < divs.length; i++) {
if (divs[i].getElementsByClassName("abc").length == 0) {
var newdiv = document.createElement('div');
newdiv.innerHTML = "some content";
newdiv.className = "xyz";
divs[i].appendChild(newdiv);
}
}
也许你想看看这个问题:How to check if element has any children in Javascript?
好像你在找什么:)
使用 jQuery:
if ($('.abc123 div').length == 0) {
$('.abc123').append('<div class="xyz">some content</div>');
}