zoukankan      html  css  js  c++  java
  • js和data-url代替a标签

    看到这样一段代码

    <ul id="sidebar-menu" class="bm-menu">
                            <li class="bm-menu-item" data-id="2">
                                <a class="bm-menu-title" data-url="pages/form.html">
                                    <i class="bm-menu__icon iconfont icon-doc"></i>
                                    <span class="bm-menu__label">表单</span>
                                </a>
                            </li>
                            <li class="bm-menu-item" data-id="3">
                                <a class="bm-menu-title" data-url="pages/404.html">
                                    <i class="bm-menu__icon iconfont icon-doc"></i>
                                    <span class="bm-menu__label">404</span>
                                </a>
                            </li>
    </ul>
    

    跳转没用a标签,而是用了div加h5的自定义属性,因为a标签有种种不确定性,比如在各种浏览器的表现形式不统一,而且鼠标hover的时候页面下方会有链接,显得很low。而div+自定义属性,在js中获取链接,通过$('.new').attr('url')获取地址,然后把链接 window.href。
    当然,data属性可以使用dataset拿到,是一个对象。但使用dataset操作data 要比使用getAttribute和setAttribute速度稍微慢些,使用dataset不能提高代码的性能,但是对于简洁代码,提高代码的可读性和可维护性是很有帮助的。

  • 相关阅读:
    springboot配置redis缓存
    【spark】local模式运行
    mybatis从入门到精通(二) 增删查改
    学习设计模式
    学习设计模式
    mybatis从入门到精通(一) 入门
    学习NIO 之 使用方法
    学习 NIO 之 零拷贝
    Java并发
    学习设计模式
  • 原文地址:https://www.cnblogs.com/shemingxin/p/12667690.html
Copyright © 2011-2022 走看看