原生js实现下拉菜单效果

最近接触Magento后台管理系统,需要是实现一个下拉菜单的功能,之前的项目都是js和jquery混和在一起使用,从未用纯js实现功能,不写不知道,写了才发现自己的不足,失去jquery,就等于没了左膀右臂,看来还是基础不牢,地动山摇。由此想到最近浏览关于IT行业的网站,出现最多的关键词就是C++、Java、Python、php...,javascript这个关键词的出现概率为0.0000001%,身为大前端的我岂能容忍,为了振兴Javascript,我要头悬梁,刺锥股好好学习js。咳咳咳,在吹牛皮就该被打死了,进入正题。。。

  • 首先拿到一个功能,先进行需求分析,里面有什么逻辑


    原生js实现下拉菜单效果_第1张图片
    image.png

    1、点击时,当前菜单展开,其他菜单关闭
    2、点击时,判断是否展开,展开则关闭,关闭则展开

  • html

Honor7x
Honor7x

Honor 7X User Testing Log

  • SCREEN

    这里面放内容,目前是测试

  • CAMERA

    这里面放内容,目前是测试

  • PERFORMANCE

    这里面放内容,目前是测试

  • CONCLUSION

    这里面放内容,目前是测试

Honor7x
  • css

  • js

如有不足之处,请多多指点+_+

你可能感兴趣的:(原生js实现下拉菜单效果)