概述
moy-dom 是一个基于原生 JavaScript 封装的 DOM 操作工具库，可以帮助我们简洁地操作 DOM 元素，提高开发效率。本文主要介绍使用 moy-dom 的相关知识及操作方法。
安装
使用 npm 安装 moy-dom：
npm install --save moy-dom
使用
在代码中引入 moy-dom：
import { query } from 'moy-dom';然后就可以使用其中的方法了。
方法介绍
query
查询 DOM 元素，支持 CSS 选择器。
query(selector: string, context: HTMLElement | Document = document);
- selector：选择器，必需；
- context：查询上下文，非必需，默认为 document。
queryAll
查询多个 DOM 元素，支持 CSS 选择器。
queryAll(selector: string, context: HTMLElement | Document = document);
- selector：选择器，必需；
- context：查询上下文，非必需，默认为 document。
attr
获取或设置 DOM 元素的属性值。
attr(element: HTMLElement, key: string, value?: string | number): string;
- element：DOM 元素，必需；
- key：属性名，必需；
- value：属性值，非必需。
hasClass
判断 DOM 元素是否包含某个类名。
hasClass(element: HTMLElement, className: string): boolean;
- element：DOM 元素，必需；
- className：类名，必需。
addClass
给 DOM 元素添加类名。
addClass(element: HTMLElement, className: string): void;
- element：DOM 元素，必需；
- className：类名，必需。
removeClass
移除 DOM 元素的某个类名。
removeClass(element: HTMLElement, className: string): void;
- element：DOM 元素，必需；
- className：类名，必需。
toggleClass
切换 DOM 元素的某个类名。
toggleClass(element: HTMLElement, className: string): void;
- element：DOM 元素，必需；
- className：类名，必需。
on
给 DOM 元素绑定事件。
on(element: HTMLElement, event: string, handler: EventListener, capture?: boolean): void;
- element：DOM 元素，必需；
- event：事件名称，必需；
- handler：事件处理函数，必需；
- capture：事件捕获或冒泡，非必需，默认为 false。
off
解除 DOM 元素绑定的事件。
off(element: HTMLElement, event: string, handler: EventListener): void;
- element：DOM 元素，必需；
- event：事件名称，必需；
- handler：事件处理函数，必需。
示例代码
<div id="app"> <button id="btn" class="btn">点击我</button> </div>
-- -------------------- ---- ------- ------ - ------ --------- ------------ --- --- - ---- ---------- ----- --- - -------------- -- -- --- -- ----- --- - -------------- -- ---- ------------- --------------- -- ---- ---------------- ------- -- ---- -------- ------------- - ----------------------- - ------- -------- ------------- -- ------ -------- -------- -------------
总结
moy-dom 是一个非常方便实用的 DOM 操作工具库，使用简单，具有一定的深度和指导意义，希望本文对大家有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600668f9d9381d61a3540fb5