[英]Wrapping an anchor tag around dynamically generated divs
我有一个div在其中生成多个元素:
<div class="lists">
<?php for($i=0;$i<6;$i++) { ?>
<div class="list history[[$i]]" id="history[[$i]]">
<div class="info">
<div class="picture monophoto">
<div class="text">BO</div>
<div class="img" style="background-image: url();"></div>
</div>
<div class="right">
<div class="lineone">John Smith</div>
<div class="linetwo">Daily Essentials</div>
</div>
</div>
<div class="boxes">
<div class="left">
<div class="box box1"></div>
</div>
<div class="right">
<div class="box box2"></div>
<div class="box box3"></div>
</div>
</div>
<a class="cbutton whiteonblack">VIEW LIST<!--SEE <span class="owner">JOHN'S</span>--></a>
</div>
<?php } ?>
</div>
我试图用锚标记包装下面的div,以便它链接:
<div class="boxes"> </div>
使用jQuery我正在尝试使用jQuery作为循环的一部分来包装它:
for(var i = 0; i < listLength; i++){
for(var y = 0; y < result.history[i].length; y++){
var history = document.getElementById('history' + i);
history.querySelector('.boxes').wrap('<a href="http://google.com"></a>');
}
}
这不会导致锚标记完全显示在DOM上。 我在做什么错,我该如何解决?
编辑:我澄清了哪个div
编辑2:澄清一下,每个链接实际上都是动态生成的。 我只是以google.com为例。 因此,影响所有特定类都行不通。
您可以通过选择.list .boxes
元素来单行执行此操作:
$('.lists .boxes').wrap('<a href="http://google.com"></a>')
请注意,这仅在使用HTML5的情况下有效,否则在内联元素( a
)中包含块级元素( div
)将是无效的。
querySelector
返回一个NodeList对象, wrap()
是一个jquery函数,它们不能一起工作,请尝试以下操作:
for(var i = 0; i < listLength; i++){
for(var y = 0; y < result.history[i].length; y++){
$('#history' + i).find('.boxes').first().wrap('<a href="http://google.com"></a>');
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.