d-spacezero/fix-the-flow-interactive-website

Ontwerp en maak een interactieve website voor een opdrachtgever

fix-the-flow-interactive-website's Issues

gebruik document.querySelectorAll

fix-the-flow-interactive-website/scripts/index.js

Line 1 in 0b73462

var acc = document.getElementsByClassName("accordion");

Als je een serie objecten wilt aanroepen in .js kan je beter document.querySelectorAll() gebruiken. Dit is sneller en breder toepasbaar.

JavaScript feedback! 💃

Goed bezig Diego!!!

Oepsie error gevonden na heel lang klikken :p

fix-the-flow-interactive-website/scripts/checklist.js

Line 18 in 54c3161

var button = document.getElementById("bediening-toggle-y");

var is de 'ouderwetse manier' we gebruiken tegenwoordig let en const
freecodecamp.org/news/var-let-and-const-whats-the-difference/#:~:text=const%20are%20necessary.-,Let,var%20that%20we%20just%20covered.%20Let%27s%20consider%20why%20this%20is%20so.,-let%20is%20block

let is voor variabelen die kunnen veranderen; voor een Boolean (true of false) bijvoorbeeld is dat handig
const is voor variabelen die niet aangepast hoeven te worden, zoals een querySelector in de meeste gevallen.

fix-the-flow-interactive-website/scripts/checklist.js

Line 22 in 54c3161

button.addEventListener("click", function() {

'Arrow functies' zijn eigenlijk ook de nieuwe standaard:
Dit wordt dan:

button.addEventListener("click", function() {
  element.classList.toggle("checklist-active-cat");
});

Dit:

button.addEventListener("click", () => {
  element.classList.toggle("checklist-active-cat");
});

https://www.w3schools.com/js/js_arrow_function.asp

Javascript in je <header>

fix-the-flow-interactive-website/index.html

Line 174 in 0b73462

<script src="./scripts/index.js"></script>

Een beetje een moving-targets onderwerp maar... het is netter om je .js in de header te plaatsen. Om ervoor te zorgen dat het pas wordt ingeladen nadat je HTML is ingeladen kan je 'defer' als attribuut opnemen zoals in:
<script src="main.js" defer></script>