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
Jquery - adding parent
提问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 img
elements with a div
then 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);
})