[jQuery] Re: Altering the inner content of a link

[Karl Swedberg]

Also, Christian Bach posted a "wrapInner" plugin back in February:

Here is the new version.

jQuery.fn.wrapInner = function(o) {
    return this.each(function(){
                 var jQ = jQuery(this);
                 var c = jQ.html();
                 jQ.empty().append(o.el).filter(o.id).html(c);
    });
}

$("p").wrapInner({el: '<a href="http://jquery.com";>', id: 'a'});

Before:
<p>I will become a link to jQuery.com</p>

After:

<p><a href="http://jquery.com";>I will become a link to jQuery.com</ a></p>

And George Adamson wrote this in March:

wrap() and innerWrap() are available for adding html around elements but

this little plugin wraps html around text nodes:

For example:
 jQuery code: $("LI INPUT").wrapText("<LABEL/>")
 Before: "<li><input/>some text</li>"
 After:   "<li><input/><label>some text</label></li>"

Note: This ignores empty text nodes or those containing just white space.

Also ignores text in any child elements.

I hope it is useful for some of you!
Cheers,
George

(Tested in IE6, FF2.0.0.1, Opera9.10)

// Plugin to wrap html around all non-empty text nodes within an element:

(ignores text in child elements)
// By George Adamson, SoftwareUnity.com, March 2007.
jQuery.fn.wrapText = function(html){
  return this.each(function(){

        $(this.childNodes).filter("[EMAIL PROTECTED]").each(function(){
                if($.trim(this.nodeValue).length > 0)
                        $(this).wrap(html)
        })

  });
};

--Karl
_________________
Karl Swedberg
www.englishrules.com
www.learningjquery.com



On Jun 2, 2007, at 12:53 AM, Brandon Aaron wrote:

I've needed this myself and have seen this come up on the list a few times. Although, the jQuery core makes this pretty easy to accomplish ... it should involve less typing and be more explicit. I've gone ahead and created a proper jQuery.fn.innerWrap method. It works much the same way wrap does ... just does it on the inside instead of outside. :)

You can find the source and example here: http://brandonaaron.net/ jquery/snippets/innerWrap/

--
Brandon Aaron

On 6/1/07, WPWOW <[EMAIL PROTECTED] > wrote:

i want to turn
<a href="#">test</a>
into
<a href="#"><span>test</span></a>

so...

$("a").prepend("<span>").append("</span>");

doesnt work because of the open tag. the first span is closed and the
second span is thrown away. (this quality should be noted in the docs,
i think.)

$("a").wrap()

would apply content to the outside of the link

$("a").html().wrap(..)

html() breaks chaining

which leaves us with

$('a').each(function(){ $(this).html('<span>'+ $(this).html() +'</
span>') });

surely there is a less ugly way, or no?

if not, i would like to propose something along the lines of
innerWrap(). same as wrap() but applies content to inside of element.