应用程序.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”相同的属性。 请帮忙!预先感谢。
使用
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');