Question

我正在使用feathericons，并且希望通过单击ID为data-feather的图标来简单地更改powerOn属性。这是一个简单的电源按钮。

我尝试过：

const powerOn = $('#powerOn');
powerOn.attr('data-feather', 'stop-circle');

但这不起作用。我还看到API具有replace()函数，但不太了解在这种情况下如何应用。

我希望在再次单击按钮后将图标切换回其初始状态，如下所示：

powerOn.attr('data-feather', 'power');

JS和JQuery和library的新手。

这是我的HTML：

<button id="connectId"
        onclick="connect()"
        class="btn btn-sm btn-success"><i id="powerOn" data-feather="power"></i> Power On</button>

更新：更正了所涉及的错字，其中包括元素ID的井号。

Answer 1

尝试一下：

df = pd.DataFrame([list(stock_info_dict.values())], columns=['code', 'name', 'date', 'open', 'high', 'low', 'close', 'volume', 'numstocks', 'diffPrices', 'diffrates'])

    df.set_index(['code', 'date'])

    filepath = os.path.abspath("D:\\PycharmProject\\202007Test\\chart\\daily.db")
    con = sqlite3.connect(filepath)
    df.to_sql('stock_info', con, if_exists='replace')

Answer 2

我需要替换整个html才能具有如下所示的切换功能：

const connectId = $('#connectId');
connectId.html(feather.icons['power'].toSvg() + ' Power On');

和

connectid.html(feather.icons['stop-circle'].toSvg() + ' Power Off');

仅使用powerOn.replaceWith将会删除<i>标签，因此图标将不会始终出现。

更改JS中的羽毛图标

2 个答案: