开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

如何使用vanilla JavaScript在Ul li上有默认和删除类？

使用vanilla JavaScript在Ul li上添加默认和删除类的方法如下：

首先，获取所有的Ul元素和对应的li元素。可以使用document.querySelector或document.querySelectorAll方法来获取元素。例如：

const ulElement = document.querySelector('ul');
const liElements = document.querySelectorAll('ul li');

接下来，为每个li元素添加一个默认类。可以使用classList.add方法来添加类。例如：

liElements.forEach(li => {
  li.classList.add('default');
});

然后，为每个li元素添加一个点击事件监听器，以便在点击时删除默认类。可以使用addEventListener方法来添加事件监听器。例如：

liElements.forEach(li => {
  li.addEventListener('click', () => {
    li.classList.remove('default');
  });
});

最后，为每个li元素添加一个删除类的方法。可以使用classList.remove方法来删除类。例如：

liElements.forEach(li => {
  li.addEventListener('click', () => {
    li.classList.remove('default');
    li.classList.add('deleted');
  });
});

这样，当点击li元素时，它将从默认类切换到删除类。你可以根据需要自定义这些类的样式。

请注意，这只是使用vanilla JavaScript实现的一种方法，你可以根据自己的需求进行修改和扩展。

相关搜索:使用if条件在JavaScript中切换添加和删除类使用jQuery在Ul li a中添加类和删除类在Javascript中:如何从元素中删除"form-group has-success“或"form-group has-error”类并重置为默认值？在javascript小部件使用Selenium和Python自动填充其默认文本之前，如何填充如何使用javascript在ul li的每个级别中添加不同的类。如何使用javascript在多个<ul>元素中搜索<li>如何使用javascript在费用跟踪应用程序中动态添加和删除表格中的项目？如何使用jQuery在循环中添加和删除类如何使用vanilla javascript在HTML画布上拖放和预览图像文件？如何使用vanilla javascript在单击时删除<li>？

相关搜索:

页面内容是否对你有帮助？

有帮助

没帮助

相关·内容

没有搜到相关的视频

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭