给HTML页面指定元素添加属性,添加父元素
下面拿一个给富文本中所有的图片增加layer弹窗效果。
思路:
- 给富文本父元素设置属性。
- 获取父元素里所有的img 此处用到querySelectorAll 函数
- for 遍历标签修改需求
复习jQuery属性
wrap给指定元素增加父元素
JS属性
.src获取标签路径值
setAttribute给标签赋值
<script type="text/javascript">
//给指定标签追加父元素
$('.memorandummainlist img').wrap('<div id="layer-photos-demo" class="layer-photos-demo" onclick="return onimg();"></div>'); //获取页面里所有的指定标签
let target = document.querySelectorAll('.memorandummainlist img');
//遍历页面里所有获取到的指定标签并执行需求的事件
for (var i = 0; i < target.length; i++) {
//获取循环中标签的SRC值
var img_src = target[i].src;
//给页面里每个指定标签属性并赋值
target[i].setAttribute('layer-src',img_src);
}
</script>
<script type="text/javascript">
//调用示例
function onimg(){
layer.photos({
photos: '#layer-photos-demo',
id:'timg',
anim:0
});
}
</script>
觉得有用了扣下1,谢谢