Comment insérer du texte dans un td avec id, en utilisant JavaScript

Je sais que ce peut être une chose simple, mais je ne peux pas comprendre. J'essaie d'insérer du texte provenant d'un événement de fonction JavaScript onload dans un td.Comment insérer du texte dans un td avec id, en utilisant JavaScript

<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>

Une aide?

Source

2010-01-29 Amra

Assurez-vous que la deuxième balise est en fait, et même avec l'étiquette de fermeture. Peut-être que c'est juste une faute de frappe quand vous le mettez dans la question, mais vous ne savez jamais. –

<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>

Source

2010-01-29 17:17:26 artlung

Je dois noter que ie <= 9 ne vous laisse pas faire innerHTML pour les éléments de la table – Denis

@Denis avez-vous une cite pour cela? Cela a été fait pour une cellule de tableau '' élément pas une table entière ou un élément de corps de table. – artlung

Eh bien, j'admets mon erreur, innerHTML à td fonctionne vraiment en IE9, mais tous les autres éléments de la table sont en lecture seule http://stackoverflow.com/a/4729743/1221082 – Denis

Si votre <td> est pas vide, une astuce populaire est d'insérer un espace insécable   en elle, tel que:

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

Ensuite, vous pourrez utiliser:

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

Sinon, si vous ne souhaitez pas ajouter le &nbsp vide de sens, vous pouvez utiliser la solution décrite par Jonathan Fingland au the other answer.

Source

2010-01-29 17:04:51

Utilisez jQuery

Regardez comment il serait facile si vous avez fait.

Exemple:

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

Source

2010-01-29 17:06:14 Gabe

Ne peut pas utiliser JQuery, mais merci. – Amra

@Cesar pourquoi pas? – Gabe

ancien poste, mais encore: vous ne devriez jamais utiliser jquery pour ces choses très faciles. ce n'est même pas moins de code avec jquery. – luschn

ajouter un nœud de texte comme suit

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

Source

2010-01-29 17:07:20

La caractéristique importante de cette solution est qu'elle ne détruit pas le contenu actuel de l'élément parent. – Pistos

Il y a plusieurs options ... en supposant que vous avez trouvé votre TD par var td = document.getElementyById('myTD_ID'); vous pouvez faire:

td.innerHTML = "mytext";
td.textContent= "mytext";
td.innerText= "mytext"; - celui-ci ne peut pas travailler en dehors de IE? Pas sûr
Utilisez le tableau firstChild ou children comme indiqué précédemment.

Si c'est juste le texte qui doit être changé, textContent est plus rapide et moins sujette aux attaques XSS (https://developer.mozilla.org/en-US/docs/Web/API/Node.textContent)

Source

2010-01-29 17:11:51 DVK

Pour une raison que j'obtiens Object ne supporte pas cette propriété ou méthode. Mais merci quand même. – Amra

Lequel des 4? – DVK

Tout ce qui est précédé par getElement -> y <- ById. –

Comment insérer du texte dans un td avec id, en utilisant JavaScript

Répondre

Questions connexes