Reputation: 2797
Is it possible to shorten these jQuery snippets by chaining them together? For the second chain, I'd like to get rid of the w
class if possible.
$('#content').prepend("<h1 />");
$('#content h1').append( $('#content>p:first strong').html() );
$('#content>p:first strong').parent().remove();
$('font').wrapInner('<p class="w"/>');
$("p.w").unwrap().unwrap();
Edit: Let me clarify my second jQuery snippet. I'm cleaning up old HTML markup that looks like this:
<div id="content">
<p>
<font>
<b>Sample Title</b>
<br>
More sample text.
</font>
</p>
</div>
And changing it to this:
<div id="content">
<p>
<b>Sample Title</b>
<br>
More sample text.
</p>
</div>
Upvotes: 0
Views: 418
Reputation: 186103
This is how I would do it:
var content = $( '#content' )[0];
var para1 = $( content ).children( 'p' )[0];
var text = $( para1 ).children( 'strong' ).text();
$( '<h1>', { text: text }).prependTo( content );
$( para1 ).remove();
As of jQuery 1.4, the second argument to jQuery() can accept a map consisting of a superset of the properties that can be passed to the .attr() method. Furthermore, any event type can be passed in, and the following jQuery methods can be called: val, css, html, text, data, width, height, or offset. The name "class" must be quoted in the map since it is a JavaScript reserved word, and "className" cannot be used since it is not the correct attribute name.
From the docs: http://api.jquery.com/jQuery/#jQuery2
So, you can pass an object literal as the second argument. That object literal "initializes" the newly created DOM element (the H1 element in our case).
Upvotes: 1
Reputation: 2904
To cut down processing, you can chain, but it's better to cash the variables (is more readeable).
You can do:
var content = $('#content'),
firstP = $('#content>p:first strong');
content.prepend("<h1 />").find("h1").append( firstP.html() );
firstP.parent().remove();
good luck!
Upvotes: 2
Reputation: 69915
Try this.
$('#content')
.prepend("<h1 />");
.find('h1').append( $('#content>p:first strong').html() )
.end()
.find('>p:first strong').parent().remove();
$('font').wrapInner('<p class="w"/>');
$("p.w").unwrap().unwrap();
.end()
ends the most recent filtering operation in the current chain and return the set of matched elements to its previous state.
Upvotes: 0
Reputation: 11295
I don't think that you'll cut down on processing time by simply chaining that code. The Rafael.IT answer is good, but I don't think it will help improve the code performance.
Upvotes: 0