首页 > 解决方案 > 如何使用 jQuery 定位名称属性

问题描述

所以...

我有这个我正在使用的图标,来自离子图标。我想添加一个 jquery,当用户单击该图标时,它会更改为另一个。但问题是,它使用属性名称来定位图标。

<a class="mobile-nav-icon js--nav-icon"><ion-icon name="menu-outline"></ion-icon></a>

我想将名称更改为其他类型的图标

<a class="mobile-nav-icon js--nav-icon"><ion-icon name="close-outline"></ion-icon></a>

如何定位名称属性?我按照 hasClass、addClass、removeClass 逻辑尝试了下面的方法,但没有奏效。

$('.js--nav-icon').click(function(){
var nav = $('.js--main-nav');
var icon = $('.js--nav-icon ion-icon');

nav.slideToggle(200);
if (icon.hasName('menu-outline')){
  icon.addName('close-outline');
  icon.removeName('menu-outline');
} else {
  icon.addName('menu-outline');
  icon.removeName('close-outline');
}});

我是 Web Dev 的新手。

标签: htmljquerycss

解决方案


你可以做:

if (icon.attr('name') === 'menu-outline'){
    icon.attr('name', 'close-outline');

推荐阅读