appendChild 不是一个函数 - 我做错了什么？答案

【问题标题】：appendChild is not a function - what am I doing wrong?appendChild 不是一个函数 - 我做错了什么？
【发布时间】：2015-08-19 10:57:32
【问题描述】：

我知道这是一个非常常见的错误，但我就是不知道为什么这不起作用。

我想动态更改跨度的值。很简单，对吧？我试过 $span.innerHTML = "text" 和 $span.innerText = "text"，它们什么都不做，但不会抛出任何错误。我最近的尝试是这样的：

var $resourceSpan = $("#divname"+dynamic_variable);
var stringVar = functionThatReturnsString();
      while( $resourceSpan.firstChild ) {
        $resourceSpan.removeChild( $resourceSpan.firstChild );
      }
      var textNode = document.createTextNode(stringVar);
      $resourceSpan.appendChild( textNode );

有谁知道我为什么会抛出这个错误？谢谢

【问题讨论】：

$resourceSpan.firstChild 不是函数吗？你需要 () 在它之后......

标签： javascript jquery html dom

【解决方案1】：

你正在处理 jQuery 对象，像 removeChild() 和 appendChild() 这样的方法属于 dom 元素而不是 jQuery 对象。

要删除元素的所有内容，您可以使用 .empty() 并设置元素的文本内容，您可以使用 .text()，但使用 .text() 将替换现有内容，因此在您的情况下您可以使用

var $resourceSpan = $("#divname" + dynamic_variable);
var stringVar = functionThatReturnsString();
$resourceSpan.text(stringVar);

【讨论】：

【解决方案2】：

你想做这样的事吗？

<html>
<head>
    <title>STACK OVERFLOW TESTS</title>
    <style>

    </style>
</head>
<body>

    <span>HI, IM SOME TEXT</span>

    <input type = 'button' value = 'Click me!' onClick = 'changeText()'></input> <!-- Change the text with a button for example... -->

    <script>
        var text = 'I AM THE NEW TEXT'; // The text to go in the span element

        function changeText(){
            var span = document.querySelector('span');
            span.innerHTML = text;
    }
    </script>
</body>
</html>

【讨论】：