HTML Diff
0 added 0 removed
Original 2026-01-01
Modified 2026-03-09
1 <p>We learned to add the class only from a single category to news stories. To do this, we compared the data attribute value for each news story with the string that was manually written. But we need to compare it with the category that the user selected in the filter. That way the filtering will be performed automatically.</p>
1 <p>We learned to add the class only from a single category to news stories. To do this, we compared the data attribute value for each news story with the string that was manually written. But we need to compare it with the category that the user selected in the filter. That way the filtering will be performed automatically.</p>
2 <p>The filter on the main page is a dropdown list with news categories.</p>
2 <p>The filter on the main page is a dropdown list with news categories.</p>
3 <p>The user can select one of the proposed categories. The selected value is stored in the<a>value property</a>for the list itself.</p>
3 <p>The user can select one of the proposed categories. The selected value is stored in the<a>value property</a>for the list itself.</p>
4 // Find the dropdown list let select = document.querySelector('select'); // Output the value to the console console.log(select.value);<p>We need to obtain the filter value when the user selects a new category. To do this, use the onchange event handler. This event handler is triggered when the user selects a new value from the dropdown menu.</p>
4 // Find the dropdown list let select = document.querySelector('select'); // Output the value to the console console.log(select.value);<p>We need to obtain the filter value when the user selects a new category. To do this, use the onchange event handler. This event handler is triggered when the user selects a new value from the dropdown menu.</p>
5 // Add the event handler select.onchange = function () { // Output the new value to the console console.log(select.value); };<p>A filter is an element with the filter class on the news site. Find it, save it to the variable, and add the onchange event handler. After that, tell JavaScript to output the filter value to the console and select several categories from the list in order.</p>
5 // Add the event handler select.onchange = function () { // Output the new value to the console console.log(select.value); };<p>A filter is an element with the filter class on the news site. Find it, save it to the variable, and add the onchange event handler. After that, tell JavaScript to output the filter value to the console and select several categories from the list in order.</p>
6 <p>The onchange event handler can be used with various elements. For example, it is triggered when the user toggles the checkbox or radio buttons.</p>
6 <p>The onchange event handler can be used with various elements. For example, it is triggered when the user toggles the checkbox or radio buttons.</p>