Hướng dẫn thử thách
1 / 1
Build a Favorite Icon Toggler
In this lab you will use JavaScript click events to toggle the appearance of a favorite icon. When the heart icon is clicked, the appearance of the heart changes from empty to filled, and vice versa.
**Objective:** Fulfill the user stories below and get all the tests to pass to complete the lab.
**User Stories:**
1. You should have an unordered list with three items.
2. The unordered list should have the class `item-list`.
3. The three list items should contain the item name followed by a `button` element with the class `favorite-icon`.
4. The `button` element should contain the code `♡` initially to represent an empty heart.
5. When a `button` element containing a heart is clicked, you should add a class named `filled` to the clicked `button` if it's not already present, and remove it, if it is.
6. You should have a class selector that targets the `filled` class and sets some CSS properties.
7. When a `button` element containing a heart is clicked, the heart symbol should toggle between `♡` (empty heart) and `❤` (filled heart), depending on its current state.
**Note:** Be sure to link your JavaScript file in your HTML. (Ex. `<script src="script.js"></script>`)
Vượt qua bài kiểm tra hiện tại để mở khóa bài tiếp theo.
main.sh
UTF-8 • Tab Size: 2Kiểm tra bài:⌘↵