ansaurus

Question

Answer 1

+4 A:

Assuming $data is the parsed DOM structure above...

$data.find('th').each(function() {
    $(this).removeAttr('scope').removeAttr('style').html(
        $(this).find('a').html()
    );
}).appendTo(selector);

Paolo Bergantino 2009-06-29 16:59:21

Doesn't get much easier than that!! Fantastic, thank you.

Josh Stodola 2009-06-29 17:05:27

One thing to add. For what it's worth, I did not have to set it to a variable. I had a var like this: var tbl = $(xhr.responseText) and all I had to do was use your code to call it like this: tbl.find('th').each(function() { etc... }) and later I just appended tbl to an element and it worked great.

Josh Stodola 2009-06-29 17:09:53

Hmmm. I guess I've always assumed that every internal methods is immutable (hence the "chaining" paradigm).

Josh Stodola 2009-06-29 17:22:01

Answer 2

A:

It seems like the easiest approach would be to select out the text and then use that to create new TH elements, which can easily be done in jQuery. Assuming your data is in a variable named data, you'd want to do something like:

var newTH = ''; // To store as you go
$("th a", data).each(function(){ // Loop over all anchors in THs
    newTH += "<th>" + $(this).html() + "</th>"; // Pull out the innerHTML of the anchor, wrap in TH
});

The newTH variable would now be a chunk of HTML that you could use jQuery to append into your table's .

I'd advise building it up as a string first, simply for speed's sake. Manipulating and changing the DOM elements works, but depending on how many TH's you get, this should theoretically be a little faster.

Brian Arnold 2009-06-29 17:03:52

I'd be shocked if appending strings like you are doing is actually faster for large data sets, which is the only situation where speed would be relevant.

Paolo Bergantino 2009-06-29 17:05:45

I'm basing that off of information pulled from http://www.learningjquery.com/2009/03/43439-reasons-to-use-append-correctly - which does seem to be rather trustworthy and repeatable. :)Also, speed may not be totally relevant in this case, but it never hurts to do things right the first time. :)

Brian Arnold 2009-06-29 17:23:59

The reason the first examples are slow on that page is because it is calling append on each iteration, which is not the right thing to do - my example never did this. As you can then see, it goes further to say strings are not best for this but instead it is best to put it all into an array and append once at the end. In this situation it doesn't matter because instead of creating elements which is more expensive, we're just modifying something that already exists.

Paolo Bergantino 2009-06-29 17:41:57

Your example didn't call something on each iteration, but I wasn't saying anything about your example (which I hadn't seen until I posted mine). :)My thinking is that creating a clean TH was a slightly safer approach, depending on the source of the HTML. If some new attributes appeared later that were also desired to be cleaned out, the code would need to be changed doing an in-place modification, whereas a new creation would still work out well.It's also HTML from an AJAX call, not already in the DOM, so both approaches are effectively new creations. :)

Brian Arnold 2009-06-29 17:53:39

ansaurus

tags:

views:

answers:

jQuery Html Manipulation Question

related questions