# CommonElement

> DOM 元素工具：位置计算、样式操作、事件绑定

- **引入**: `import { CommonElement } from '@cldemo/library/common'`

## 方法

| 方法 | 说明 |
|------|------|
| `onListener(element: any, eventName: string, eventFun: any, useCapture = false)` | 添加事件监听 |
| `offListener(element: any, eventName: string, eventFun: any, useCapture = false)` | 移除事件监听 |
| `getTextWidth(text: string, font = "normal 12px Microsoft YaHei")` | Canvas 测量文字宽度 |
| `getAddClass(...classs: any)` | 条件添加 CSS class（去重） |
| `getRemoveClass(classTotal: string, classs: string)` | 移除 CSS class |
| `checkHasClass(classTotal: string, className: string)` | 检查是否存在 CSS class |
| `isElementHtml(el: any)` | 是否 HTML 元素 |
| `isElementBody(el: any)` | 是否 body 元素 |
| `getWinScrollTop()` | 获取窗口滚动量 |
| `getWinWidth()` | 获取窗口宽度 |
| `getWinHeight()` | 获取窗口高度 |
| `getStyle(el: any)` | 获取元素 computed style |
| `isHidden(element: any)` | 元素是否隐藏 |
| `isHiddenParent(element: any)` | 父级元素是否隐藏 |
| `getParentCheckBody(el: any, parent: any, isCheckContains = true)` | 获取父级并排除 body |
| `getParent(el: any, parentAttr: any, elUpperLimit?: any, isLimitReturnSelf = true)` | 向上查找匹配 attr 的父级元素 |
| `getParentList(el: any, parentAttr: any)` | 获取所有匹配父级的列表 |
| `getParentScrollList(el: any, parentAttr: any, isContainsSelf = true)` |  |
| `getOffset(el: any, viewEl: any = null)` | 获取相对 window/容器的偏移量 |
| `getPositionView(el: any, viewEl: any = null)` | 获取相对指定容器的位置信息（含宽高） |
| `getPosition(el: any, parentAttr: any = null)` | 获取相对父级的位置 |
| `getElementIndex(el: any)` | 获取同级元素中的索引 |
| `getPrev(el: any)` | 获取前一个同级元素 |
| `getPrevAll(el: any)` | 获取所有前面的同级元素 |
| `getNext(el: any)` | 获取后一个同级元素 |
| `insertAfter(targetEl: any, newEl: any)` | 在目标元素之后插入 |
| `getFocusSelection(targetEl: any)` | 获取输入框光标位置 |
| `setFocusSelection(el: any, start: number, end: number)` | 设置输入框光标位置 |
| `calculationDropdownPosition(controlEl: any, textEl: any, dropDownEl: any, arrowEl: any, containerEl: any)` | 计算下拉定位（自动判断方向） |
| `getElementData(json: any)` |  |
| `getClientXY(e: Event | MouseEvent | TouchEvent)` | 从 MouseEvent/TouchEvent 提取 clientX/Y |

