javascript - 用于创建标题并将文本放入标题下方的段落的循环

Question

function newHeader (header) {
var head = document.createElement('h'+ header);
var hText = document.createTextNode('text for h'+ header);
head.appendChild(hText);
document.body.appendChild(head);
}

function newPara (para) {
var newP = document.createElement('p');
var newPText = document.createTextNode("text for p" + para);
newP.appendChild(newPText);
var intoH = document.getElementByTagName('h' + header);
intoH.item(0).appendChild(newP);
}

 for (i = 1; i <= 6; i++) {
newHeader(i);
 }
 for (i = 1; i <= 6; i++) {
 newPara(i);
 }

我做错了什么？我想动态创建标题并在其中放置带有文本的段落。我试图使用 item() 到 appendChild 相应地将新段落文本放置在标题中，但它不起作用。我得到要显示的标题，但不是段落。

求助!谢谢!

Answer 1

你在使用 header 变量时没有定义(你应该用 para 替换它)，而且你在 中错过了 s >getElementByTagName 应该是 getElementsByTagName 并且它将返回一个元素数组，因此您可以使用 [0] 而不是 item(0) 指定第一个元素:

document.getElementsByTagName('h' + para)[0];

希望这对您有所帮助。

---

function newHeader (header) {
  var head = document.createElement('h'+ header);
  var hText = document.createTextNode('text for h'+ header);
  head.appendChild(hText);
  document.body.appendChild(head);
}

function newPara (para) {
  var newP = document.createElement('p');
  var newPText = document.createTextNode("text for p" + para);
  newP.appendChild(newPText);
  var intoH = document.getElementsByTagName('h' + para)[0];
  intoH.appendChild(newP);
}

for (i = 1; i <= 6; i++) {
  newHeader(i);
}
for (i = 1; i <= 6; i++) {
  newPara(i);
}