☰

JavaScriptを使用してカスタム属性を設定する 質問する

tag-icon • tag-icon javascript dom dynatree
JavaScriptを使用してカスタム属性を設定する 質問する

私はDynaTree（https://code.google.com/p/dynatree) しかし、いくつか問題があり、誰かが助けてくれることを願っています。

以下のようにページにツリーを表示しています。

<div id="tree">
    <ul>
        <li class="folder">Outputs
            <ul>
                <li id="item1" data="icon: 'base.gif', url: 'page1.htm', target: 'AccessPage'">Item 1 Title</li>
                <li id="item2" data="icon: 'base.gif', url: 'page2.htm', target: 'AccessPage'">Item 2 Title</li>
                <li id="item3" data="icon: 'base.gif', url: 'page3.htm', target: 'AccessPage'">Item 3 Title</li>
                <li id="item4" data="icon: 'base.gif', url: 'page4.htm', target: 'AccessPage'">Item 4 Title</li>
            </ul>
        </li>
    </ul>
</div>

しかし、私はアイテムが選択されているかどうかに関係なく、アイコンを変更しようとしています。JavaScript。

使用したい新しいアイコンはbase2.gifです

以下の方法を試してみましたが、うまくいかないようです:

document.getElementById('item1').data = "icon: 'base2.gif', url: 'output.htm', target: 'AccessPage', output: '1'";

私が何を間違っているのか誰か知っていますか?

ベストアンサー1

次の方法を使用しますsetAttribute。

document.getElementById('item1').setAttribute('data', "icon: 'base2.gif', url: 'output.htm', target: 'AccessPage', output: '1'");

しかし、実際には、次のように、データの後にダッシュとそのプロパティを付けて使用する必要があります。

<li ... data-icon="base.gif" ...>

JS でこれを行うには、次のdatasetプロパティを使用します。

document.getElementById('item1').dataset.icon = "base.gif";

おすすめ記事