Récupérer le contenu d'un <td> en javascript

Bonjour à tous.
J'ai une <table> que je rempli par une function Javascript à partir d'un formulaire

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12

function ajout(f, calTot) { var t=document.getElementById("Panier").tBodies[0]; var tr, td; tr=document.createElement("tr"); for(i=1;i<5;i++) { td=document.createElement("td"); td.appendChild(document.createTextNode(f[i].value)); tr.appendChild(td); }

---

sur double click sur une ligne j'efface toute la ligne par le code suivant

Code:

---

1 2 3 4 5

tr.ondblclick = function() { this.parentNode.removeChild( this); }

---

ça marche très bien. Avant la suppression de la ligne, je voudrais récupérer le contenu d'un <td> (le 4ème) de cette ligne. Pouvez-vous m'indiquer comment procéder. Merci d'avance.

Malheureusement en JS pure je ne sais pas. !en JQuery par contre ça serait :

Code:

---

1 2 3 4 5

$( 'tr' ).on( 'dblclick', function( ) { var tmpText = $( this ).find( td:eq(3) ).text( ); $( this ).remove( ); } );

---

Je ne connais rien à jQuery.:oops:En tout cas, merci Darkaurora.

Code:

---

1 2 3 4 5

tr.ondblclick = function() { alert(this.getElementsByTagName('td')[3].innerHTML) this.parentNode.removeChild( this); }

---

Bonjour,

Je suis d'accord avec la réponse de SpaceFrog mais je pense qu'il serait peut être plus judicieux d'utiliser .textContent à la place de .innerHTML
En effet .innerHTML récupère aussi les balises HTML alors que textContent ne récupère que le texte.

Par exemple : http://jsfiddle.net/quRkQ/1/
Dans cette exemple il y la solution à ton problème et si tu tentes de supprimer la 4ème ligne tu verras la différence entre textContent et innerHTML. Tu choisiras selon ton besoin. ;)

En espérant avoir pu aider.

PS: je rajouterais juste au passage que cela dépend le comportement que tu veut avoir mais il est préférable de ne pas attacher ces événement en utilisant la syntaxe :

Code:

---

element.ondblclick = function(){ /* do something */ };

---

mais plutôt avec addEventListener (+ attachEvent pour la compatibilité IE < 9 )
Pour voir la différence et te faire une idée > http://jsfiddle.net/mLHv8/

Merci beaucoup j'ai opter pour ".textContent" et ça marche bien. Vous m'avez bien aidé.

Attention textContent n'est pas supporté chez IE < 9

Oui, après on trouve toujours des polyfills qui permettent de gérer le soucie de compatibilité si c'est important pour nous. Pour moi par exemple je pense qu'il faut être compatible IE >= 8.
IE 6 et 7 sont dorénavant obsolète.

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17

if (Object.defineProperty && Object.getOwnPropertyDescriptor && Object.getOwnPropertyDescriptor(Element.prototype, "textContent") && !Object.getOwnPropertyDescriptor(Element.prototype, "textContent").get) (function() { var innerText = Object.getOwnPropertyDescriptor(Element.prototype, "innerText"); Object.defineProperty(Element.prototype, "textContent", { // It won't work if you just drop in innerText.get // and innerText.set or the whole descriptor. get : function() { return innerText.get.call(this) }, set : function(x) { return innerText.set.call(this, x) } } ); })();

---

voila le script ici à insérer seulement si le navigateur est IE8 pour le rendre compatible. (trouvé ici)

Citation:

---

IE 6 et 7 sont dorénavant obsolète.

---

Dans le meilleurs des mondes ...

Bonjour,
j'aurais simplement fait un

Code:

---

var content = this.cells[3].textContent || this.cells[3].innerText;

---

Idem que NoSmoking, car en plus c'est compatible IE < 8, contrairement à la solution de MisterPur. Qui est néanmoins sexy ! (la solution, hein :mrgreen:)

A noter que innerText et textContent ne font pas exactement la même chose : sur IE, innerText ne renvoie pas le texte des <script> , <style> et éléments cachés