在div中找到第一个img并在其下面放置一个新的div

时间:2013-10-04 19:43:21

标签: javascript jquery

我正在尝试使用下面的代码在jquery下面放置一个div,但它不起作用。

<head>中的

我有这段代码:

<script type="text/javascript">
$( document ).ready(function() {
$(".gdl-blog-full").find("img").prepend("<div id='1' style='width:400px; float: left; margin-top:10px; background-color: #000;'> You are watching 5th object out of 100 </div>");
});
</script>

<body>里面我有这个:

<div class="gdl-blog-full">
<img src="logoF.png" width="400" height="93" />
</div>

我只想在图片下方放置<div> ..

5 个答案:

答案 0 :(得分:3)

喜欢this

    $('.gdl-blog-full>img:first-child').after("<div>hello</div>");

答案 1 :(得分:0)

使用$.after

$('.gdl-blog-full').find('img:first-child').after('<div id='1' style='width:400px; float: left; margin-top:10px; background-color: #000;'> You are watching 5th object out of 100 </div>');

答案 2 :(得分:0)

使用.after将元素放在指定元素之后,同时:first-child获取第一张图片:

$(".gdl-blog-full").find("img:first-child").after("<div id='1' style='width:400px; float: left; margin-top:10px; background-color: #000;'> You are watching 5th object out of 100 </div>");

答案 3 :(得分:0)

不应该在

之后添加
<script type="text/javascript">
$( document ).ready(function() {
$(".gdl-blog-full").find("img").after("<div id='1' style='width:400px; float: left; margin-top:10px; background-color: #000;'> You are watching 5th object out of 100 </div>");
});
</script>

答案 4 :(得分:0)

使用.insertAfter将元素放在另一个之后。

$("<div id='1' style='width:400px; float: left; margin-top:10px; background-color: #000;'> You are watching 5th object out of 100 </div>").insertAfter(".gdl-blog-full img:first-child");