使用 JavaScript 显示 SPAN 的内容答案

【问题标题】：Showing the contents of a SPAN using JavaScript使用 JavaScript 显示 SPAN 的内容
【发布时间】：2011-05-01 05:42:40
【问题描述】：

我有这个代码。我已经这样做了好几年了，但我对这个例子的结果感到困惑。目的是让文本框可见，并将点击的SPAN标签的内容放入其中。

document.onclick = CaptureClickedElement;

function CaptureClickedElement(e)
{
var EventElement;
if(e==null)
    EventElement = event.srcElement;// IE
else
    EventElement = e.target;// Firefox

if( EventElement.tagName == "SPAN")
    {
    document.getElementById("divTXT").style.display="";
    document.getElementById("txt").value = document.getElementById("Span1").innerHTML;
    alert(document.getElementById("Span1").innerHTML)
    }
}

奇怪的是，它确实显示了内容，但还在其末尾显示了打开/关闭 SPAN 标记。如果我提醒他们结果，则会显示相同的内容。

请在此处找到附加的屏幕截图。

有人知道为什么会这样吗？

谢谢！

这是 HTML（由 mplungjan 从 cmets 复制）

<style type="text/css"> 
 #divOuter { 
   width: 100px; 
   height: 70px; 
   border: 1px solid blue; 
   float: left; 
 } 
 </style>

<body> 
  <div> 
    <form name="frm" method="post" action=""> 
      <div id="divTXT" style="display:none"> 
        <input type="text" id="txt" name="txt" value="" size="30" /> 
      </div> 
    </form> 
  </div> 
  <div id="divOuter"> 
    <span id="Span1">hi, this is a test.<span> 
  </div> 
</body>

【问题讨论】：

嗨，这是一个测试。

标签： javascript innerhtml html

【解决方案1】：

结构问题：

<span id="Span1">hi, this is a test.<span>

注意没有适当的接近跨度。

【讨论】：

很好看。当我将 html 粘贴到 :O 时，我什至没有发现这一点
@itsols 并不愚蠢 - 我已经多次看到这种怪异现象。当你得到一个元素的 innerHTML 并且它返回给你一个标签片段时，你应该自动怀疑一个结构问题。

【解决方案2】：

需要使用 .innerText（对于 IE）和 .text 对于其他人。

【讨论】：

感谢您的快速回答，但 innerText 和 text 都不起作用。他们给出“未定义”警报。
不需要innerText/textContent