Question

我知道这可能是一件简单的事情，但我无法弄明白。我试图将一些来自JavaScript函数onload事件的文本插入到td。

<html>
 <head>
  <script type="text/javascript">
   function insertText ()
   {
       //function to insert any text on the td with id "td1"
   }
  </script>
 </head>
 <body onload="javascript:insertText()">
  <table>
   <tr>
    <td id="td1">
    </td>
   </tr>
  </table>
 </body>
</html>

任何帮助？

Answer 1

<html>

<head>
<script type="text/javascript">
function insertText () {
    document.getElementById('td1').innerHTML = "Some text to enter";
}
</script>
</head>

<body onload="insertText();">
    <table>
        <tr>
            <td id="td1"></td>
        </tr>
    </table>
</body>
</html>

Answer 2

附加一个文本节点，如下所示

var td1 = document.getElementById('td1');
var text = document.createTextNode("some text");
td1.appendChild(text);

Answer 3

有几种选择......假设您可以通过var td = document.getElementyById('myTD_ID');找到您的TD：

td.innerHTML = "mytext";
td.textContent= "mytext";
td.innerText= "mytext"; - 这个可能无法在IE之外运行？不确定
使用firstChild或children数组作为上一张海报。

如果只是需要更改的文本，textContent更快，更不容易受到XSS攻击（https://developer.mozilla.org/en-US/docs/Web/API/Node.textContent）

Answer 4

如果您的<td>不为空，则一个流行的技巧是在其中插入一个非中断空格 ，以便：

 <td id="td1">&nbsp;</td>

然后你就可以使用：

 document.getElementById('td1').firstChild.data = 'New Value';

否则，如果您不想添加无意义的&nbsp，您可以使用Jonathan Fingland在the other answer中描述的解决方案。

Answer 5

使用jQuery

看看你做得多么容易。

示例：

$('#td1').html('hello world');

如何使用JavaScript在带有id的td中插入文本

5 个答案: