我正在尝试使用Javascript对此HTML文件中“ eventsList” ID中的li元素设置样式。我一直在玩代码,无论出于何种原因,样式都无法正常工作。我觉得这一定是一个超级简单的解决方案,但是作为一个新手,我无法弄清楚。 如果可以的话,前四个项目符号点应使用黑体和橙色字体设置。
function findElements() {
var events = getElementById('eventsList');
var linkItems = events.getElementsByTagName('li');
for (var i = 0; i < linkItems.length; ++i) {
linkItems[i].style.color = 'orange';
linkItems[i].style.fontWeight = 'bold';
}
}
window.onload = findElements;
<h2>Subheading</h2>
<ul id="eventsList">
<li>List 1</li>
<li>List 2</li>
<li><a href="www.google.com">Linked list Item</a></li>
<li>List 4</li>
</ul>
我在做什么错?
答案 0 :(得分:4)
您必须使用document.getElementById
:
function findElements() {
var events = document.getElementById('eventsList');
var linkItems = events.getElementsByTagName('li');
for (var i=0; i< linkItems.length;++i) {
linkItems[i].style.color="orange";
linkItems[i].style.fontWeight="bold";
}
}
window.onload = findElements;
<ul id="eventsList">
<li>List 1</li>
<li>List 2</li>
<li><a href="www.google.com">Linked list Item</a></li>
<li>List 4</li>
</ul>
答案 1 :(得分:1)
您有一个小问题。 getElementById
本身并不存在。它是document
的属性。更正后的行如下所示:
var events = document.getElementById('eventsList');
对于将来的问题,这是您自己发现问题的方法。打开开发人员工具(在许多浏览器中为F12),然后在控制台中查看。您会看到一条错误消息,指出未定义getElementById
。这提醒您确保您在正确的对象上引用正确的方法。
答案 2 :(得分:1)
您真的很亲密!只是一些基本错误。您需要在底部执行该功能,并且需要从文档中获取eventsList。
function findElements() {
var events = window.document.getElementById('eventsList');
var linkItems = events.getElementsByTagName('li');
for (var i=0; i< linkItems.length;++i) {
linkItems[i].style.color="orange";
linkItems[i].style.fontWeight="bold";
}
}
window.onload = findElements();