Question

我正在学习JavaScript，我遇到了DOM方法的问题。 HTML

<html>
<head>
    <title>TODO supply a title</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="DOM_Ponovno.js"></script>
</head>
<body>
    <div>
        <p id="demo" >
        this is the first paragraph</p>
        <p> boooooooooooommmmmmmmmmmm</p>       
        <p> third paragraph  </p>

        <button onclick="changeText()">click me</button>
    </div>
</body>

function changeText() {  
    var tmpTag = document.getElementsByTagName("p");

    for(var i = 0;i< tmpTag.length;i++) {
        document.write(tmpTag[i].textContent);
    }
}

如果我按照教程确定，但我想按标签名称p显示所有元素。我想显示存储在tmpTag中的所有段落。

有人请解释一下：怎么能（为什么不能）显示标签名为p的所有元素？怎么能（为什么不能）从变量tmpTag显示3x p标签？尝试使用prototype.slice.call方法更改为Array但没有成功。你知道像Java东西循环显示/更改索引等。

谢谢：）

嗨和thanx快速回答.. Sory关于它用于测试的函数名称...我只想按标签名称p显示所有元素。此代码仅显示第一个元素，并且i计数器中的循环停止为1.为什么我无法获得其他2个段落元素？

我在Java中使用类似system.out.print的document.write来查看数组中的内容。我知道如果我想改变我需要innerHTML。

Answer 1

如果您想要更新每个段落，请不要使用文档写入。请尝试以下方法：

function changeText() {  
  var tmpTag = document.getElementsByTagName("p");

  for(var i = 0;i< tmpTag.length;i++) {
    tmpTag[i].innerHTML = "Your new updated text to change it to for tag index " + i + "...";
  }
}

Answer 2

正如@Juhana所提到的那样，当您开始循环时，您使用document.write覆盖文档，因此所有p标记都会从document中删除，并替换为textContent中的文本第一段，然后你的函数失败，因为现在空的对象没有任何function changeText() { var tmpTag = document.getElementsByTagName("p"); var print = ''; for(var i = 0;i< tmpTag.length;i++) { print += tmpTag[i].textContent; } document.write(print) }属性。您可以连接所有内容并将其写入一次：

document.write

但实际上，只是不要使用div - 这些片段甚至不再允许它！这是一种以var output = document.getElementById('output'); function changeText() { var tmpTag = document.getElementsByTagName("p"); for(var i = 0;i< tmpTag.length;i++) { output.textContent += tmpTag[i].textContent; } }作为输出的方式：

＆＃13;

<div>
  <p id="demo" >this is the first paragraph</p>
  <p> boooooooooooommmmmmmmmmmm</p>       
  <p> third paragraph  </p>

  <button onclick="changeText()">click me</button>
</div>

<div id="output"></div>

＆＃13;

> fit <- try(lmFit(matrix, design))
Error in chol2inv(fit$qr$qr, size = fit$qr$rank) : 
  'x' must be a square numeric matrix

＆＃13;

Answer 3

我不确定你要做什么，但你可以为id='result'添加另一个div结果并附加你想要的结果，请查看以下示例。

希望这会有所帮助。

function changeText() {  
    var tmpTag = document.getElementsByTagName("p");
    var result = document.getElementById('result');
    
    for(var i = 0;i< tmpTag.length;i++) {
        result.innerHTML += tmpTag[i].textContent+'<br>';
    }
}

<div>
  <p id="demo" >
    this is the first paragraph</p>
  <p> boooooooooooommmmmmmmmmmm</p>       
  <p> third paragraph  </p>

  <button onclick="changeText()">click me</button>
  <br>
  <div id="result" ></div>
</div>

Javascript显示方法elementsbyTagName中的所有（元素，标签）

3 个答案: