# Javascript Notes

$$
I needed this because I wanted the callback function to be more complex than a line or two: `javascript const makeHideHandler = (element) => { // higher order function return () => { // event handler function element.hidden = true; / action to perform }; }; hider.addEventListener('click', makeHideHandler(hider)); ` > However, the real strength of the higher order function approach becomes visible if you have more than one element that should hide the same (or other!) element(s). Consider the following: Let's say, you have multiple buttons that, when pressed, should hide the same element. It's easy peas with `makeHideHandler`: `javascript // grab all "button" elements const hideButtons = document.querySelectorAll('.hide-button'); // grab the element to hide const elemToHide = document.querySelector('.hide-me'); // make the handler, pass in the element that should be hidden const hideHandler = makeHideHandler(elemToHide); // add listeners to the buttons hideButtons.forEach((button) => { button.addEventListener('click', hideHandler); }); ` Or to create buttons that hide themself after pressing: \`\`\`javascript const hideButtons = document.querySelectorAll('.hide-button'); hideButtons.forEach((button) => { button.addEventListener('click', makeHideHandler(button)); // <-- pass in the button element }); --- ## Javascript DOM Manipulation tutorial: <https://m.youtube.com/watch?v=y17RuWkWdn8> `innerText` returns plain text `textContent` returns all text with formrtting use `append` and not appendChild append can take multiple items and also strings `innerHtml` will let you use html in strings remove() deletes from DOM .id or .title will give the attribute for example setAttribute('id', 'newId') removeAttribute('id') .classList does class stuff .classList.toggle toggles on and off .style is for css styles example .style.backgroundColor = "red"; .style.display = "block";
$$


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://chadboyce.gitbook.io/notes/javascript_notes.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.