Update article.md
This commit is contained in:
parent
4b02949e95
commit
b2f7515c5d
1 changed files with 5 additions and 5 deletions
|
@ -84,7 +84,7 @@ let divs = document.getElementsByTagName('div');
|
||||||
|
|
||||||
This method is callable in the context of any DOM element.
|
This method is callable in the context of any DOM element.
|
||||||
|
|
||||||
Let's find all `input` inside the table:
|
Let's find all `input` tags inside the table:
|
||||||
|
|
||||||
```html run height=50
|
```html run height=50
|
||||||
<table id="table">
|
<table id="table">
|
||||||
|
@ -123,16 +123,16 @@ The `"s"` letter is absent in `getElementById`, because it returns a single elem
|
||||||
```
|
```
|
||||||
|
|
||||||
````warn header="It returns a collection, not an element!"
|
````warn header="It returns a collection, not an element!"
|
||||||
Another widespread novice mistake is to write like:
|
Another widespread novice mistake is to write:
|
||||||
|
|
||||||
```js
|
```js
|
||||||
// doesn't work
|
// doesn't work
|
||||||
document.getElementsByTagName('input').value = 5;
|
document.getElementsByTagName('input').value = 5;
|
||||||
```
|
```
|
||||||
|
|
||||||
That won't work, because it takes a *collection* of inputs and assigns the value to it, rather to elements inside it.
|
That won't work, because it takes a *collection* of inputs and assigns the value to it rather than to elements inside it.
|
||||||
|
|
||||||
We should either iterate over the collection or get an element by the number, and then assign, like this:
|
We should either iterate over the collection or get an element by its index, and then assign, like this:
|
||||||
|
|
||||||
```js
|
```js
|
||||||
// should work (if there's an input)
|
// should work (if there's an input)
|
||||||
|
@ -374,7 +374,7 @@ Other methods can be called on elements too. For instance `elem.querySelectorAll
|
||||||
Besides that:
|
Besides that:
|
||||||
|
|
||||||
- There is `elem.matches(css)` to check if `elem` matches the given CSS selector.
|
- There is `elem.matches(css)` to check if `elem` matches the given CSS selector.
|
||||||
- There is `elem.closest(css)` to look for a nearest ancestor that matches the given CSS-selector. The `elem` itself is also checked.
|
- There is `elem.closest(css)` to look for the nearest ancestor that matches the given CSS-selector. The `elem` itself is also checked.
|
||||||
|
|
||||||
And let's mention one more method here to check for the child-parent relationship:
|
And let's mention one more method here to check for the child-parent relationship:
|
||||||
- `elemA.contains(elemB)` returns true if `elemB` is inside `elemA` (a descendant of `elemA`) or when `elemA==elemB`.
|
- `elemA.contains(elemB)` returns true if `elemB` is inside `elemA` (a descendant of `elemA`) or when `elemA==elemB`.
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue