javascript Jquery - 添加父级

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/5339761/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-25 16:52:54  来源:igfitidea点击:

Jquery - adding parent

javascriptjqueryhtml

提问by Robik

I am new to jQuery and i have a problem.

我是 jQuery 的新手,但遇到了问题。

I have script that for resize each image in some div. And i want to insert that image into non existing div (create div-parent), how?

我有用于调整某些 div 中每个图像大小的脚本。我想将该图像插入到不存在的 div(创建 div-parent)中,如何?

EDIT:

编辑:

I've got this code:

我有这个代码:

$('#content img').each(function() {

            if( $(this).width() > maxWidth || $(this).height() > maxHeight )
            {   
                var ratio = 0;
                if( $(this).width() > $(this).height() )
                {
                    ratio = maxWidth / $(this).width();
                    $(this).css('width', maxWidth + 'px');
                    $(this).css('height', ( $(this).height() * ratio) + 'px' );
                }
                else
                {
                    ratio = maxHeight / $(this).height();
                    $(this).css('width', ($(this).width() * ratio) + 'px');
                    $(this).css('height', maxHeight + 'px');
                }

                $(this).addClass('scaled-img');
                $(this).wrap('<div class="test"></div>'); // trying to add

            }                               

            });
});

Result:

结果:

<img src="path.."/>

Result that i want:

我想要的结果:

<div><img src="path"/></div>

回答by Matt Ball

Use .wrap().

使用.wrap().

HTML

HTML

<div id="some-div">
    <img ... />
    <img ... />
    <img ... />
</div>

JavaScript

JavaScript

$(function ()
{
    $('#some-div > img').wrap('<div class="new-parent"></div>');
});

Result

结果

<div id="some-div">
    <div class="new-parent"><img ... /></div>
    <div class="new-parent"><img ... /></div>
    <div class="new-parent"><img ... /></div>
</div>


Demo(now with extra kittens!)

演示(现在有额外的小猫!)

回答by Pointy

Look at the ".wrap()" jQuery method. It lets you wrap en element in some other container element:

查看“.wrap()”jQuery 方法。它允许您将 en 元素包装在其他一些容器元素中:

$('#myImage').wrap('<div></div>');

If you need to give the container some properties:

如果你需要给容器一些属性:

$('#myImage').wrap($('<div></div>', {
  id: "newWrapper",
  class: 'wrapper banana',
  css: { 'borderColor': 'green', 'borderWidth': '2px' }
}));

回答by frictionlesspulley

$('#demowrap').wrap('<div id="parent"></div>');

where demowrap is the id on the img (u can change this to whatever selects your image. http://api.jquery.com/wrap/

其中demowrap是在IMG的ID(U可以改变这一切,选择你的形象。 http://api.jquery.com/wrap/

回答by David says reinstate Monica

Without the specifics of your script, and marm-up, it's difficult to answer this question properly. But, for general information: to add an image to a div, you can use either prependTo()or appendTo().

如果没有您的脚本的细节和标记,就很难正确回答这个问题。但是,对于一般信息:要将图像添加到 div,您可以使用prependTo()appendTo()

$('img').appendTo('#elementToAddImageTo');

You could also use:

您还可以使用:

$('#elementToAddImageTo').append($('img'));

If you simply want to wrap the imgelements with a divthen use wrap():

如果您只是想img用 a包装元素,请div使用wrap()

$('img').wrap('<div></div>');

回答by EJW

I can't for the life of me figure out why these solutions are not working for me:

我一生都无法弄清楚为什么这些解决方案对我不起作用:

//everything is an array of 14 items
//footer is in my html andi've tested manually adding the <div class="dot></div> and it works

everything.forEach(function(){

  d = document.createElement('div');
  //this console log proves that it is being created 14 times
  console.log(d)

  $(d).addClass("dot").appendTo($('.footer'))

  //or this: $('.footer').append(d);

})