首页  >  文章  >  web前端  >  如何用纯 JavaScript 替换 jQuery 类切换?

如何用纯 JavaScript 替换 jQuery 类切换?

Patricia Arquette
Patricia Arquette原创
2024-10-21 11:13:291008浏览

How to Replace jQuery Class Toggling with Pure JavaScript?

jQuery 类切换的纯 JavaScript 替代方案

问题:
转换切换类名称的 jQuery 代码对于纯 JavaScript 的响应式菜单。

解决方案:

选项 1:

  • 利用 classList。 toggle() 方法,大多数现代浏览器都支持该方法。
<code class="javascript">var menu = document.querySelector('.menu');
menu.classList.toggle('hidden-phone');</code>

选项 2(较旧的浏览器):

  • 使用 classList .js 库来启用 classList.toggle() 功能。
<code class="javascript">// Install classList.js using your preferred package manager.
var menu = document.querySelector('.menu');
menu.classList.toggle('hidden-phone');</code>

附加说明:

  • 建议使用类代替ID 用于更好的封装并避免污染全局命名空间。

以上是如何用纯 JavaScript 替换 jQuery 类切换?的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn