在使用JQuery -jQuery结束标记的img之后添加HTML。之前的问题

时间:2011-05-11 17:55:49

标签: jquery html

好吧,所以我试图使用JQuery在一个(我知道,我知道......不是我的模板)中关闭一个img。发生的事情是这样的--JQuery正在关闭我添加的标签.before ...我不希望它关闭直到.after我添加...我真的在努力解决这个问题。任何帮助,将不胜感激。我试过.prepend / .append,和.wrap ......

这是代码......

$(document).ready(function(){
$("img.bottomShadow").each(function(){
    var imageWidth = $(this).attr("width");
    var width = imageWidth + 10;
        $(this).before("<span class='image_shadow_container'>");
        $(this).after("<img class='noimgbg' alt='' src='images/image_shadow.png' width='" + width + "'></span>");
});

});

我想要的是:

<span class="image_shadow_container">
                                        <img src="images/fwidth_img_3.jpg" class="image_shadow" alt="" />
                                        <img src="images/image_shadow.png" alt="" width="300" class="noimgbg" />

                                    </span>

我得到的是......

   <span class="image_shadow_container"></span>
<img class="bottomShadow" width="160" height="128" alt="" src="images/newsimages/smallben.jpg">
<img class="noimgbg" width="170" src="images/image_shadow.png" alt="">

由Jquery“早期”关闭跨度......任何想法?

2 个答案:

答案 0 :(得分:2)

你必须.wrap(),不要使用.before(),因为jQuery会解析并更正未关闭的标签:

$("img.bottomShadow").each(function(){
    var imageWidth = $(this).attr("width");
    var width = imageWidth + 10;

    $(this).wrap("<span class='image_shadow_container' />");
    $(this).after("<img class='noimgbg' alt='' src='images/image_shadow.png' width='" + width + "'></span>");
});

答案 1 :(得分:0)

首先将所有html代码构建到字符串中,然后使用JQuery来设置它。