DOM Elements API
Overview
In addition to accessing DOM elements using a selector, the "data-it" attribute can be used to assign a variable to an element, allowing direct access and interaction with it through the "$it" object.
Example of HTML markup with variable assignment:
<div data-it="bookName">Cat</div>
<div data-it="user.name">Alex</div>
<div data-it="userContent">
<div data-it="user.id">10</div>
<div data-it="user.name">Alex</div>
<div data-it="user.email">alex@example.com</div>
</div>Example of getting an array with DOM elements:
const bookName = $it.bookName;
const userContent = $it.userContent;
const userId = $it['user.id'];
const userName = $it['user.name'];
const userEmail = $it['user.email'];
When getting DOM elements, the result is always an array of DOM elements.
If no DOM element with the specified variable is found on the page, an empty array is returned.
If no DOM element with the specified variable is found on the page, an empty array is returned.
Example of renaming DOM element variables:
$it.bookName = 'bookNameSecond';
$it.userContent = 'userContentSecond';
$it['user.id'] = 'user.id.second';
$it['user.name'] = 'user.name.second';
$it['user.email'] = 'user.email.second';