Javascript 如何使用innerHTML/innerText将内容附加到querySelectorAll元素？

我目前有我的类元素：

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

当前该div为空。我现在想“附加/添加”一些内容到该div中-我尝试了

innerHTML

+

innerText

，但出于某种原因，似乎没有添加任何内容

示例：

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

---

有什么建议吗？我不确定是否有同样的方法，或者从性能角度来看，是否有更好的方法？

这将为您提供一个包含类名的元素列表

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

你想要第一个元素吗

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

这将为您提供一个元素，第一个元素

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

追加

编辑

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

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

或者如果我没有正确理解

html

EDIT2

html

---

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

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

创建一些html作为字符串

let html = `put your html here`;

从字符串创建元素

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

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

find.appendChild(div);

---

document.querySelectorAll（“.name”）[0]->如果您得到一个列表并想要第一个项目Hi cocco，非常感谢您的回答。对于单元素选择器：document.querySelector（“.name”）；-可以更精确地引用它吗？就像想象我在两个不同的容器中有class.name一样，一个容器的id为：“name-container-1”，另一个容器的id为“name-container-2”，您想通过id获取元素吗？不。我想通过类名来获取它，但我想在特定id容器中以类名为目标。我添加了一个脚本，说明如何获取每个元素的单个id。啊，sry不精确-场景是：这很有帮助：）

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

document.querySelector("#container1>.my-class")

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

let html = `put your html here`;

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

find.appendChild(div);