qq_34571911 2021-08-27 14:02 采纳率: 80%
浏览 198
已结题

原生javascript如果给li加上一个id

原生javascript如何实现,

  • 当屏幕滚动到距离顶部 topbox这个div 超过2300px的距离时给
  • 自动加多一个id 变成
  • ,反之如果不超过2300px的距离时则取消j加的这个id名

    
     <style type="text/css">
    body{height:6000px;display:block;width:100%;}
            .topbox {
                width: 1000px;
                height: 100px;
                margin: 0 auto;
                background-color: #ccc;
            }
            
    
            .leftNav {
                position: fixed;
               top:200px;
                left: 10px;
                width: 60px;
            }
            
            .leftNav ul {
                list-style: none;
            }
            
            .leftNav ul li {
                width: 60px;
                height: 60px;
                background-color: #ccc;
            }
            
            .leftNav ul li a {
                display: block;
                width: 60px;
                height: 60px;
                line-height: 60px;
                text-align: center;
                text-decoration: none;
                font-size: 14px;
            }
            
    
        </style>
    
    
    <body>
        <div class="topbox"></div>
    
        <div class="leftNav" id="Nasdav">
            <ul>
                <li>
                    <a href="javascript:;" class="number">1F</a>
                  
                </li>
                <li>
                    <a href="javascript:;" class="number">2F</a>
                    
                </li>
                
                <li class="abc">
                    <a href="javascript:;" class="number">3F</a>
                   
                </li>
       
                    
                </li>
            </ul>
        </div>
    
    
    </body>
    
    
    
  • 写回答

2条回答 默认 最新

  • qq_17585675 2021-08-27 14:33
    关注
    
    <script type="text/javascript">
        //添加滚动事件
        window.addEventListener("scroll",function(e){
            var t =document.documentElement.scrollTop||document.body.scrollTop;
            console.log(t)
            if(t > 2400 ){
                //超过2400加上Id
                if(document.getElementsByClassName("abc")[0].id==""){
                    document.getElementsByClassName("abc")[0].setAttribute("id","bbc")
                }
            }else{
                //小于2400去掉ID
                if(document.getElementsByClassName("abc")[0].id!=""){
                    document.getElementsByClassName("abc")[0].removeAttribute("id")
                }
                
            }
        });
    </script>
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题?

问题事件

  • 系统已结题 9月4日
  • 已采纳回答 8月27日
  • 赞助了问题酬金 8月27日
  • 创建了问题 8月27日

悬赏问题

  • ¥15 超声波 合成孔径 扩散角
  • ¥20 matlab中的双层数值积分
  • ¥50 服务器打印水晶报表问题
  • ¥15 Delphi image图片缩放问题
  • ¥30 gradle环境下javafx项目如何使用druid连接池
  • ¥15 服务器打印水晶报表问题
  • ¥15 初学者用plt报错,求解答
  • ¥18 深度学习tensorflow1,ssdv1,coco数据集训练一个模型
  • ¥100 关于注册表摄像头和麦克风的问题
  • ¥30 代码本地运行正常,但是TOMCAT部署时闪退