appendChild w/ string

[eggie5]

I have a string representing a table row: row='<tr><td>this is a row</
td></tr>

I would like to add it to my table by calling appendChild on my table
tbody element like this:

tbody.appendChild(row);

However, appendChild only works with elements, how can I do this?
Convert my string to an element object?

 

[RobG]

I have a string representing a table row: row='<tr><td>this is a row</
td></tr>

I would like to add it to my table by calling appendChild on my table
tbody element like this:

tbody.appendChild(row);

However, appendChild only works with elements, how can I do this?
Convert my string to an element object?

You can try something like:

var s = '<tr><td>this is a row';
var div = document.createElement('div');
div.innerHTML = '<table>' + s + '</table>';
var row = div.getElementsByTagName('table').rows[0];

But you may be better to pass the data for the row some other way and
build the row using DOM methods.

<URL: http://developer.mozilla.org/en/doc...ples#Example_8:_Using_the_DOM_Table_Interface

 

[eggie5]

Well, I wanted to use appendChild to the tbody 'cause I already have
rows in the table and I just wanted to add this new one to the end. I
am creating this row using the Template class of the prototype.js
library.

I have a string representing a table row: row='<tr><td>this is a row</
td></tr>

I would like to add it to my table by calling appendChild on my table
tbody element like this:

However, appendChild only works with elements, how can I do this?
Convert my string to an element object?

You can try something like:

var s = '<tr><td>this is a row';
var div = document.createElement('div');
div.innerHTML = '<table>' + s + '</table>';
var row = div.getElementsByTagName('table').rows[0];

But you may be better to pass the data for the row some other way and
build the row using DOM methods.

<URL:http://developer.mozilla.org/en/docs/Gecko_DOM_Reference:Examples#Exa...

 

[RobG]

Please don't top-post here. Posting order restored.

You can try something like:

var s = '<tr><td>this is a row';
var div = document.createElement('div');
div.innerHTML = '<table>' + s + '</table>';
var row = div.getElementsByTagName('table').rows[0];

But you may be better to pass the data for the row some other way and
build the row using DOM methods.

<URL:http://developer.mozilla.org/en/docs/Gecko_DOM_Reference:Examples#Exa...

Well, I wanted to use appendChild to the tbody 'cause I already have
rows in the table and I just wanted to add this new one to the end. I
am creating this row using the Template class of the prototype.js
library.

What I showed you is pretty much exactly what Prototype.js does with
its Element.update method, but saves you serving over 2,500 lines of
library to do it. jQuery's clean method is similar.

You might try the DOM 3 LSParser, but I think you'll find support
limited.

<URL: http://www.w3.org/TR/DOM-Level-3-LS/load-save.html#LS-LSParser >