为什么setAtrribute和removeAttribute不起作用

问题描述 投票:0回答:1

应用程序.js

const ul = document.querySelector('ul');

const li = document.createElement('li');

ul.append(li);

li.innerText = 'X-Men';

li.setAttribute('id', 'main-heading');


索引.html

<body>
    <div class="container">
        <h1 id="main-heading">Favorite Movie Franchise</h1>
        <ul>
            <li class="list-items">
                <span>Neo</span>
                The Matrix
            </li>
            <li class="list-items">
                Star Wars
            </li>
            <li class="list-items">
                Harry Potter
            </li>
            <li class="list-items">
                Lord of Rings
            </li>
            <li class="list-items">
                Marvel
            </li>
        </ul>
    </div>
    <script src="app.js"></script>
</body>

我添加了我的 Html 页面的图像,其中标题显示我想将“X 战警”的属性设置为与“最喜欢的电影系列”的 h1 元素相同。为此,我尝试在动态创建的 li 元素上使用 setAttribute 方法, 但它不起作用。我期望 li 元素具有与“main-heading”相同的属性。 请帮忙!预先感谢。

javascript html dom dom-manipulation
1个回答
-1
投票

使用

li.setAttribute('id', 'main-heading');
,您可以将
id
属性设置为值
main-heading

之后,您使用

li.removeAttribute('id');
删除所述属性。

您是否想更改拥有

main-heading
ID 的人?如果是这样,你可以这样做:

document.getElementById('main-heading').removeAttribute('id');
li.setAttribute('id', 'main-heading');
© www.soinside.com 2019 - 2024. All rights reserved.