从许多元素中获取 InnerHTML答案

【问题标题】：Get InnerHTML from many elements从许多元素中获取 InnerHTML
【发布时间】：2014-01-17 06:57:34
【问题描述】：

我的问题很简单，但我仍然无法完成。我不知道我的代码到底出了什么问题，这让我很不高兴。

我想要做的就是将InnerHTML 文本放入带有hna ID 的div 元素中。

HTML：

<input type='button' value='test' onclick='tst()'>
  <div class='paragraphe'>
    <div class='bloc_agence'>
      <h3>wa7d</h3>
    </div>
  </div>
  <div class='paragraphe'>
  <div class='bloc_agence'>
    <h3>joj</h3>
  </div>
</div>
<div class='paragraphe'>
  <div class='bloc_agence'>
    <h3>tlata</h3>
  </div>
</div>
<div id='hna'></div>

Javascript：

a=document.getElementsByClassName('paragraphe').children.getElementsByClassName('bloc_agence').children.getElementsByTagName('H3');

function tst(){
    for(i=0;i<a.length;i++){
document.getElementById('hna').InnerHTML+=a[i].InnerHTML+'<br>';
    }}

我的直播jsfiddle

【问题讨论】：

我们真的有 .children 方法吗？
@KunJ 一个属性。 developer.mozilla.org/en-US/docs/Web/API/ParentNode.children
我记得以前可以用纯 JavaScript 答案回答纯 JavaScript 问题的日子。

标签： javascript for-loop innerhtml

【解决方案1】：

你只需要改进一些语法并使用querySelectorAll

a = document.querySelectorAll('.bloc_agence > h3');

function tst() {
    var str = '';        
    for (i = 0; i < a.length; i++) {
        str  += a[i].innerHTML + '<br>'; // Not InnerHTML it must be innerHTML
    }
 document.getElementById('hna').innerHTML = str;
}

Updated Fiddle

【讨论】：

附注：最好为innerHTML 构建一个字符串并分配一次。

【解决方案2】：

用 JQuery 试试

    function tst(){
$('#hna').empty();
$('.bloc_agence h3').each(function(){
   var tex=$(this).text() 
   $('#hna').append(tex+'</br>');
});
}

DEMO

【讨论】：

也许有一个原因，为什么帖子没有用 [jQuery] 标记。如果我添加了一个 [LISP] 标签并用 LISP 给出答案，是否正确？
Teemu 你很聪明 .. 我没有标记 jquery 但谢谢 .. 我想在现有网页上插入此代码（在 URL barre 中）所以我将此代码更改为 @987654323 @ 但它不起作用..我想将所有这些元素复制到剪贴板（我需要将数据库插入到 excel 中）
@Sridhar R：绝对正确，但不是在 JS 中 :) 虽然它很有用，但我正在消除你回答的消极情绪。

【解决方案3】：

您在 for() 循环之前获得了错误级别的元素。您只想获取最外层元素的数组，然后遍历它们 (.paragraphe)：

function tst(){
    a = document.getElementsByClassName('paragraphe');

    str = '';
    for(i=0;i<a.length;i++){
       header = a[i].getElementsByTagName('h3')[0];
       str += header.innerHTML+'<br>';
    }
    document.getElementById('hna').innerHTML = str;  
}

JSFiddle

【讨论】：

感谢您的回答 oGeez。