??? React? ??? ?????? Dojo? ??? ????? ??? ?? ????? JQuery? ??? ??? ?? ??? ?? ????? ? ??????? ?? ??? ?? ?? ?? ??? ? jQuery ??? ????????.

??? ?? ?? JavaScript ?????? ?????. ????? ????? API ???? ????? DOM? ???? ?????? ???? ?? ? ????? ?? ??? ?????.

? ??????? ???? ?? ?? ?????? ???????? (??? ??? ? ?????). jQuery? ??? DOM ????? ?????? ?? ????. ?, ?? ??? ???? ?? ? ?? ??? ????????.

• ??? ??? ???? ?????? ????. ??? ??? ?? ??? ??? ????. ??? ??? ??? jQuery? ????. ???? ?? ? ? ??? ??? ??? ? ????? ?????.
• ??? ???? ?? ?????? ?? ???? ???? ????. ?? ??? ? ??? Chrome, Firefox ? Safari?? ????? IE? ?? ?? ??????? ???? ?? ? ????.
• ??? ???? ??? ?? ??? ??? ?? ????. ?? ??, ??? prepend ???? ??? ????? ????? ??? ?? ?????.

1. ???????? ??? ??? ????

?? ??? ???????. ??? ??? ???? ???? ?? ?? ? ECMASCRIPT ?? (ESM)? ?????.

 ?? ??? ? {
    ??? (???) {

    }
}

?????, ??? ???? ?? ??? ???? Dome ??? ???? ???? ? ?? ?? ? ? ????. ??? ? ?? CSS ????? ????? ?? DOM ?? ?? document.querySelectorAll ? ??? ???? ?? ??? ??? ? ?? ????. ??? length ?? ?? ?? ??? ??? ? ? ????. ???? ???? this.elements ? ?????. ??, Dome ??? ?? ?? dom ??? ??? ?? ?? ???? ? ??? ??????? ??? ????? ?? ?????.

?? ?? ? ?? ??? ??? map ???? ???????. Dome ? ??? ???? ?? ??? ?? ?? ? ???? ?? ??? ??? ??? ? ?? ???????.

?? forEach ???? ?????. ????? ??? mapOne ?? ??? ? ????. ? ??? ?????? ?? ? ? ??? ?? ??? ? ???? ????? ??? ??? "??? ??"??? ??? ?? ?? ??????.

??? ?? ??? ??

???? ???? ?? ?? ??? ???? ?? ?? ??? ????. ???? ????? ?? ? ? ?? ?? ? ??? ??? ?? ??? ??? ?? ????? ???? ?? ????.

? ??? ?? dom ?? ( $("li").text() )? ??? Dome ??? ??? ?? ??? ?? ?? ???? ?? ? ?? ???? ?????. ??? ?????? ?? ??? ???? ??? ? ?? ?? ??? ???? ??????.

? ????? ?? ??? ??? ??? ??? ?? ??? ???? ??? ?????. ?? ??? ?? ??? ?? ???? ?? ?? ???? ?????. ??? ???? ??? ?? ???????. ??? ?? ??? ?? ???? ?? ?? ??? ??? ?? ?????.

????? ?????

??? mapOne ?? map ?? ? ?? ?? ?? ????? ?? ??? ?????. ??? ??? ????? ?? ? ? ??? ?? ??????? : ??? ? ? ????!

 Mapone (??) {
    const m = this.map (??);
    M.Length> 1? M : M [0];
};

4. ??? ? HTML ??

???? text ???? ???? ?? ??? ???????. ??? ??? ???? ???? ???? ????. ??? ????, ??? ??? mapOne ???? ?? ? ????. ?? ???? ???? ????? ???????.

html ???? text ???? ?? ????? innerHTML ????? ?? ????? ?? ?????.

 html (html) {
    if (html typeof! == "undefined") {
        this.foreach (function (el) {
            el.innerhtml = html;
        });
        ??? ??????;
    } ? ?? {
        ? this.mapone (function (el) {
            el.innerhtml? ?????.
        });
    }
}

?? ???? : ?? ?????.

5. ?? ???

???? ???? ???? ??? ? ??? ???? addClass ? removeClass ???? ??? ???.

addClass ???? ? ??? classList.add ???? ?????. ???? ?? ? ? ?? ??? ? ???? ??? ?? ? ? ??? ???? ??? ?? ? ?? ???? ?????.

 AddClass (???) {
    return.foreach (function (el) {
        if (typeof classs! == "string") {
            for (const elclass of classes) {
                el.classlist.add (elclass);
            }
        } ? ?? {
            el.classlist.add (???);
        }
    });
}

?? ??????

?? ??? ???? ?? ?????? ?? ?? ?? ??? ???? classList.remove ? ??????.

6. ??? ??????

???? attr Function? ?????. html ??? ?? ???? ??? ????. ??? ??? ?????, ??? ??? ??? ?? ??? ? ????. ??? ?? ??? ? ??? ??? ?? ?? ? ?? ? ????.

 attr (attr, val) {
    if (typeof val! == "undefined") {
        return.foreach (function (el) {
            el.setattribute (attr, val);
        });
    } ? ?? {
        ? this.mapone (function (el) {
            el.getAttribute (attr);
        });
    }
}

val ? ???? setAttribute ???? ?????. ??? ??? getAttribute ???? ?????.

7. ??? ????

??? ??? ??? ?? ? ????? ?? ???? ??? ? ? ????. ?? ??? Dome ??? ???? ??? ????.

 ???? ?? ?? (tagname, attrs) {

}

?????, ??? ??? ??? ?? ??? ? ?? ??? ?????. ???? ??? attr ???? ?? ???? ??? ??? text ???? ?? Dome ??? ?????. ?? ??? ?? ?? ??? ??? ????.

 ???? ?? ?? (tagname, attrs) {
    el = new Dome ([document.createElement (tagname)]);
    if (attrs) {
        for (attrs? ????) {
            if (attrs.hasownproperty (key)) {
                el.attr (key, attrs [key]);
            }
        }
    }
    el el;
}

?????, ??? ??? ??? ? Dome ??? ?? ????.

??? ?? ??? ??? ??? ??? ????. ??? ???? dom? ???? ?? ????.

8. ?? ? ??? ??

????, ??? append ???? prepend ??? ??? ????. ??? ??? ?? ?? ?? ??? ?? ??? ?? ?? ????. ??? ? ??? ?? ??? ????.

 dome1.append (dome2);
Dome1.prepend (dome2);

??? ????? ???? ?? ? ????.

• ?? ??? ?? ??? ?? ??? ??
• ?? ??? ?? ??? ?? ?? ?? ??? ??
• ?? ??? ?? ??? ?? ?? ??
• ?? ??? ?? ??? ?? ?? ?? ??

?? "???"? ???? ?? DOM? ?? ?? ??? ?? DOM? ????. ?? ???? ??? ???.

 ?? (els) {

}

??? els Dome ??? ? ??? ?????. ??? DOM ?????? ?? ?? ?? ???? ????? ?????? ????. ??? ? ??? ?? ??????, ? ?? ????? ? ??? ?????.

??? ???? ??, ?? ??? ?? ? ?? Dome ??? i ?? (???? ??) ?? ? ?????. ??? ?? ?? ? ?? ??? ???? ??? ?? ??? ?? prepend ??? ??????.

9. ??? ??????

???? ?? remove ??? ???????. removeChild ???? ???? ?? ?????. ??? ? ???? ?? forEach ??? ???? ??? ???? ??? ???? removeChild ?? ????, ? ??? Dome ??? ??? DOM? ?? ?? ???? ???? ??? ?? ??? ??? ? ????. ??? ????

10. ?? ???

?????, ??? ?? ??? ??? ??? ?????.

on ???? ????? ??? ?? ???????.

 on (evt, fn) {
    return.foreach (function (el) {
        el.addeventListener (EVT, FN, False);
    });
}

??? ?? ?????. ??? ??? ???? addEventListener ???? ???????. off ?? (unloked ??? ???)? ?? ?????.

 OFF (EVT, FN) {
    return.foreach (function (el) {
        el.removeEventListener (EVT, FN, False);
    });
}

11. ?? ?????

Dome ????? ????? ?? ?? ????.

 "./dome.js"?? {dome, create} ?? ??

???? ??? ?? ??? ? ????.

 New Dome ( "Li")
...

?? ?? ????? ES ???? ??????.

?? ??!

?? ??? ??? ?? ???? ???? ?? ?? ? ? ??? ????. ?? ????? Github? ?????. ???? ??, ????? ? ??? ?????.

?? ????????.? ????? ??? ?? ??? ?????? ??????? ????? ????. ?? ?? ?? ???? ?? ??? ???? ??? ?? ??????. ??? ??? ??? ??? ??? ??? ?? ?? ???? ???? ????.

???? ??????? ???? ?? ????. ??? ??? ???? ?? ? ???? ??? ?? ?? ? ????. ??? ??? ?? ?? ?? ? ????. ?? ???? ??? ????.

• jQuery ?? ?? (Paul Irish)?? ?? 11 ??
• jQuery? ?? ??? (James Padolsey)
• REACT 16 : API ???? ?? ??? ??? ?? UI ?????? ? ??

? ???? Jacob Jackson? ??? ?????????. Jacob? ? ???, ?? ??, ???? ? ?? ?? ??????.

? ??? ? ?? JavaScript ?????? ??????? ?? ?????. ??? ??? PHP ??? ????? ?? ?? ??? ?????!