I have put together together a list of items in an HTML file and each time I check an item in the list I want it to appear where it says "Filter will display here" as a button" I've run a console.log over the js code and it says: "item not checked."
const headerTag = document.querySelector('.header-tag');
const list = document.querySelectorAll('.checkbox li')
const listItems = [...list];
for(let i = 0; i < listItems.length; i++) {
if(listItems.checked === true) {
console.log('item checked');
} else {
console.log('item not checked');
}
}
.header-tag {
display: contents;
}
</head>
<body>
<div class="header-tag">
<p class="header-tag">Filter will display here</p>
<ul class="checkbox">
<li>
<input type="checkbox" name="item1" class="item-list">Natural Systems
</li>
<li>
<input type="checkbox" name="item1" class="item-list">Sustainability Integration
</li>
<li>
<input type="checkbox" name="item1" class="item-list">Social Systems
</li>
</ul>
</body>
<script src='script.js'></script>
</html>
Aucun commentaire:
Enregistrer un commentaire