9

我目前有我的班级元素：

var frame_2 = document.querySelectorAll(".name");

目前这个 div 是空的。我现在想在那个 div 中“追加/添加”一些内容——我尝试了innerHTML+innerText但由于某种原因似乎没有添加任何内容。

例子：

frame_2.innerHTML = '<img src="image.gif" />';

和

frame_2.innerText = 'some text';

有什么建议么？我不确定是否有办法做同样的事情 - 或者性能更好的东西？

4

2 回答 2

19

这为您提供了包含类名的元素列表

var name=document.querySelectorAll(".name");

你想要第一个元素？

name[0].textContent='some text';

这为您提供了一个元素，即第一个元素。

var name=document.querySelector(".name");
name.textContent='some text';

追加内容_

name.appendChild(document.createTextNode('pizza'));
name.appendChild(document.createElement('div')).textContent='spaghetti';
name.appendChild(document.createElement('img')).src='cookie.jpg';

编辑

要按类名获取元素，然后检索 id ：

var names=document.querySelectorAll(".name"),l;
while(l--){
console.log(names[l].id);
}

或者如果我没有正确理解

html

<div class="spaghetti" id="pizza"></div>

js

document.querySelector(".spaghetti#pizza")

编辑2

html

<div id="container1"><div class="my-class"></div></div>

js

document.querySelector("#container1>.my-class")
于 2013-12-27T01:07:41.660 回答
3

更简单的解决方案，任何用例。查询您的选择器：

let find = document.querySelector('.selector');

创建一些 html 作为字符串

let html = `put your html here`;

从字符串创建元素

  let div = document.createElement('div');
  div.innerHTML = html;

将您创建的新 html 附加到选择器

find.appendChild(div);
于 2019-01-30T06:06:01.393 回答