zoukankan      html  css  js  c++  java
  • 给HTML页面指定元素添加属性,添加父元素

    给HTML页面指定元素添加属性,添加父元素

    下面拿一个给富文本中所有的图片增加layer弹窗效果。

    思路: 

    1. 给富文本父元素设置属性。
    2. 获取父元素里所有的img   此处用到querySelectorAll 函数
    3. 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,谢谢

  • 相关阅读:
    3组Alpha冲刺5/6
    3组Beta冲刺4/5
    3组Alpha冲刺6/6
    3组Beta冲刺2/5
    3组Beta冲刺3/5
    delegate Demo (一个关于System.Timers.Timer的Demo)
    System.Web.HttpException 与 HTTP Error 404.13 Not Found问题解决说明
    常用SQL关于表的操作
    设计模式学习笔记:单例模式
    JS 实践杂记
  • 原文地址:https://www.cnblogs.com/chenliuxiao/p/10194240.html
Copyright © 2011-2022 走看看