Html DOM: Difference between revisions
From wikinotes
| Line 15: | Line 15: | ||
<syntaxhighlight lang="javascript"> | <syntaxhighlight lang="javascript"> | ||
document.querySelector('div.foo-class'); // find items by CSS-selector | document.querySelector('div.foo-class'); // find first matching item by CSS-selector | ||
document.querySelectorAll('div.foo-class'); // find all matching items by CSS-selector | |||
document.getElementById('foo-id'); // find element with ID | document.getElementById('foo-id'); // find element with ID | ||
document.getElementsByClassName('foo-class'); // find elements with class | document.getElementsByClassName('foo-class'); // find elements with class | ||
</syntaxhighlight> | </syntaxhighlight> | ||
</blockquote><!-- Examples --> | </blockquote><!-- Examples --> | ||
Revision as of 16:38, 1 September 2021
Query/Manipulate an HTML page from javascript using it's DOM (domain-object-model).
Documentation
DOM docs https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model
Examples
You can select items from javascript using css selectors.
document.querySelector('div.foo-class'); // find first matching item by CSS-selector document.querySelectorAll('div.foo-class'); // find all matching items by CSS-selector document.getElementById('foo-id'); // find element with ID document.getElementsByClassName('foo-class'); // find elements with class
