❤
npm
Sign UpSign In

chimee-helper-dom

0.1.8 • Public • Published

chimee-helper-dom

Build Status Coverage Status npm dependency Status devDependency Status

dom handler of chimee

get started

npm install chimee-helper-dom --save

if you are using flow, you should import our flow defination, by adding this to your .flowconfig.

[ignore]

[include]

[libs]
./node_modules/chimee-helper-dom/lib/index.flow.js
[options]

[lints]

doc

Table of Contents

dom

src/index.js:11-11

一些常用的DOM判断及操作方法，可以使用dom.$('*')包装DOM，实现类jQuery的链式操作；当然这里的静态方法也可以直接使用。

Meta

  • author: huzunjie

getAttr

src/index.js:22-24

读取HTML元素属性值

Parameters

Returns String

setAttr

src/index.js:32-38

设置HTML元素属性值

Parameters

addClassName

src/index.js:45-59

为HTML元素添加className

Parameters

  • el HTMLElement 目标元素
  • cls String 要添加的className（多个以空格分割）

removeClassName

src/index.js:66-84

为HTML元素移除className

Parameters

  • el HTMLElement 目标元素
  • cls String 要移除的className（多个以空格分割）

hasClassName

src/index.js:92-94

检查HTML元素是否已设置className

Parameters

Returns Boolean

supportsPassive

src/index.js:100-100

addEventListener 是否已支持 passive

Returns Boolean

removeEvent

src/index.js:120-132

为HTML元素移除事件监听

Parameters

  • el HTMLElement 目标元素
  • type String 事件名称
  • handler Function 处理函数
  • once Boolean 是否只监听一次 (optional, default false)
  • capture Boolean 是否在捕获阶段的监听 (optional, default false)

addEvent

src/index.js:142-159

为HTML元素添加事件监听

Parameters

  • el HTMLElement 目标元素
  • type String 事件名称
  • handler Function 处理函数
  • once Boolean 是否只监听一次 (optional, default false)
  • capture (Boolean | Object) 是否在捕获阶段监听，这里也可以传入 { passive: true } 表示被动模式 (optional, default false)

addDelegate

src/index.js:169-193

为HTML元素添加事件代理

Parameters

  • el HTMLElement 目标元素
  • selector String 要被代理的元素
  • type String 事件名称
  • handler Function 处理函数
  • capture Boolean 是否在捕获阶段监听 (optional, default false)

removeDelegate

src/index.js:203-210

为HTML元素移除事件代理

Parameters

  • el HTMLElement 目标元素
  • selector String 要被代理的元素
  • type String 事件名称
  • handler Function 处理函数
  • capture Boolean 是否在捕获阶段监听 (optional, default false)

getStyle

src/index.js:218-220

读取HTML元素样式值

Parameters

Returns String

setStyle

src/index.js:228-236

设置HTML元素样式值

Parameters

query

src/index.js:245-248

根据选择器查询目标元素

Parameters

  • selector String 选择器,用于 querySelectorAll
  • container HTMLElement 父容器 (optional, default document)
  • toArray Boolean 强制输出为数组

Returns (NodeList | Array)

removeEl

src/index.js:254-256

从DOM树中移除el

Parameters

findParents

src/index.js:265-278

查找元素的父节点们

Parameters

  • el HTMLElement 目标元素
  • endEl HTMLElement 最大父容器（不指定则找到html） (optional, default null)
  • haveEl Boolean 包含当前元素
  • haveEndEl Boolean 包含设定的最大父容器

NodeWrap

src/index.js:289-544

NodeWrap DOM包装器，用以实现基本的链式操作 new dom.NodeWrap('') 相当于 dom.$('') 这里面用于DOM操作的属性方法都是基于上面静态方法实现，有需要可以随时修改补充

Parameters

  • selector String 选择器(兼容 String||HTMLString||NodeList||NodeArray||HTMLElement)
  • container HTMLElement 父容器（默认为document）

each

src/index.js:327-330

循环遍历DOM集合

Parameters

  • args ...any
  • fn Function 遍历函数 fn(item, i)

Returns Object

push

src/index.js:337-340

添加元素到DOM集合

Parameters

Returns this

splice

src/index.js:348-350

截取DOM集合片段，并得到新的包装器splice

Parameters

  • args ...any
  • start Nubmer
  • count Nubmer

Returns NodeWrap 新的DOM集合包装器

find

src/index.js:357-366

查找子元素

Parameters

Returns NodeWrap 新的DOM集合包装器

append

src/index.js:373-378

添加子元素

Parameters

Returns this

appendTo

src/index.js:385-388

将元素集合添加到指定容器

Parameters

Returns this

text

src/index.js:395-402

DOM集合text内容读写操作

Parameters

  • val String 文本内容（如果有设置该参数则执行写操作，否则执行读操作）

Returns this

html

src/index.js:409-416

DOM集合HTML内容读写操作

Parameters

  • html String html内容（如果有设置该参数则执行写操作，否则执行读操作）

Returns this

attr

src/index.js:424-429

DOM集合属性读写操作

Parameters

  • name String 属性名称
  • val String 属性值（如果有设置该参数则执行写操作，否则执行读操作）

Returns this

data

src/index.js:437-447

DOM集合dataset读写操作

Parameters

  • key String 键名
  • val Any 键值（如果有设置该参数则执行写操作，否则执行读操作）

Returns this

css

src/index.js:455-460

DOM集合样式读写操作

Parameters

  • key String 样式key
  • val String 样式值（如果有设置该参数则执行写操作，否则执行读操作）

Returns this

addClass

src/index.js:467-469

为DOM集合增加className

Parameters

  • cls String 要增加的className

Returns this

removeClass

src/index.js:476-478

移除当前DOM集合的className

Parameters

  • cls String 要移除的className

Returns this

hasClass

src/index.js:485-487

检查索引0的DOM是否有className

Parameters

  • cls String 要检查的className

Returns this

on

src/index.js:497-499

为DOM集合添加事件监听

Parameters

  • type String 事件名称
  • handler Function 处理函数
  • once Boolean 是否只监听一次 (optional, default false)
  • capture Boolean 是否在捕获阶段监听 (optional, default false)

Returns this

off

src/index.js:509-511

为DOM集合解除事件监听

Parameters

  • type String 事件名称
  • handler Function 处理函数
  • once Boolean 是否只监听一次 (optional, default false)
  • capture Boolean 是否在捕获阶段监听 (optional, default false)

Returns this

delegate

src/index.js:521-523

为DOM集合绑定事件代理

Parameters

  • selector String 目标子元素选择器
  • type String 事件名称
  • handler Function 处理函数
  • capture Boolean 是否在捕获阶段监听 (optional, default false)

Returns this

undelegate

src/index.js:533-535

为DOM集合解绑事件代理

Parameters

  • selector String 目标子元素选择器
  • type String 事件名称
  • handler Function 处理函数
  • capture Boolean 是否在捕获阶段监听 (optional, default false)

Returns this

remove

src/index.js:541-543

从DOM树中移除

Returns this

$

src/index.js:552-554

根据选择器查询并得到目标元素的wrap包装器

Parameters

  • selector String 选择器,另外支持 HTMLString||NodeList||NodeArray||HTMLElement
  • container HTMLElement 父容器

Returns Object

Versions

Current Tags

  • Version
    Downloads (Last 7 Days)
    • Tag
  • 0.1.8
    65
    • latest

Version History

Package Sidebar

Install

npm i chimee-helper-dom

Repository

github.com/Chimeejs/chimee-helper-dom

Homepage

github.com/Chimeejs/chimee-helper-dom#readme

Weekly Downloads

66

Version

0.1.8

License

MIT

Last publish

Collaborators

  • welefen
  • huzunjie
  • toxicjohann
  • yandeqiang
  • gaoyiyi
  • songguangyu
Try on RunKit
Report malware