Waseem's answer doesn't look good for a couple reasons, most
importantly calling obj.remove(). That will delete the image from the
DOM, which renders every action before it pretty useless :P
It also doesn't take into account the OP's request to also include the
caption text if it exists.
Try this to get familiar with chaining and manipulation:
$('p').wrapInner('<div></div>').children().insertBefore($('p'));
If you're working from having a reference to the image (where this ==
your image):
var p = $(this).parent();
p.wrapInner('<div></div>').children().insertBefore(p);
HTH
On Jun 6, 3:48 pm, infoaddicted <jack.lapla...@gmail.com> wrote:
> wasseem's answer looks good, I'd just like to off a little friendly
> advice on coding style, advice meant to make revisiting
> your own code in the future easier as well as making it under-
> standable to others.
>
> in a block like:
>
> {
> var a= $(this).attr('alt');
> ...
> }
>
> consider using more user friendly variables names, like
>
> var alt = ...
> var substr_1 = ...
>
> and putting spaces around operators like the concatenation
>
> "foo" + "bar"
>
> the few bytes added to your code size is a very small percentage
> of your total page size.
>
> You can find a lot of good advice in the same vein here:
>
> Code Conventions for the JavaScript Programming Language
> -http://javascript.crockford.com/code.html
>
> On Jun 6, 5:11 pm, Bruce MacKay <b.mac...@massey.ac.nz> wrote:
>
> > Hi folks,
>
> > The following function takes an image tag (or table) that appears
> > within a p tag container in the form
> > < p> <img> text < /p>
>
> > and wraps the image (and caption if a title is present) into a div
> > for floating left, right, or centering.
>
> > My problem is that I don't know how to shift the processed image from
> > within the p container to immediately before it (so that the created
> > div is not within a p container)
>
> > I'd appreciate help in this next step.
>
> > Thanks,
>
> > Bruce
>
> > function fnDoImages() {
> >
> > $('img.imgposl,img.imgposr,img.imgposc,img.tblposl,img.tblposr,img.tblposc'
> > ).each(function(i)
> > {
> > var a = $(this).attr('alt');
> > var q = $(this).attr('class').substr(0,3);
> > var p = $(this).attr('class').substr(6);
> > var t = $(this).attr('title');
> > var w = $(this).attr('width');
> > if (a.length=0) {
> > $(this).attr('alt',''+t+'');
> > }
> > $(this).wrap("<div class='buggybox clearfix'
> > id='g"+i+"'></div>");
> > if (q=='tbl' && t.length>0) {
> > $(this).before("<p class='imgcaption'
> > style='width:"+w+"px;'>"+t+"</p>");
> > } else if (t.length>0){
> > //$(this).after("<p class='imgcaption'
> > style='width:"+w+"px;'>"+t+"</p>");
> > };
> > $("#g"+i).addClass("img"+p).css({width:w+'px'});
> > });
>
> > }
