html

页面相关函数。

Source:

Methods

(static) blobToDataURL(blob) → {String}

blob 对象转换为 dataURL。

Source:
Parameters:
Name Type Description
blob Blob

blob 对象。
Returns:
Type:
String

dataURL 。

Example
blobToDataURL(blob).then(dataURL => {
  console.log(dataURL)
})

(static) canvasToImg(canvas) → {String}

获取 canvas dataURL（转化为图片）。

获取的图片分辨率适应当前设备的设备像素比，即在 Retina 屏幕下获取的图片分辨率更高。

Source:
Parameters:
Name Type Description
canvas HTMLElement

canvas 节点。
Returns:
Type:
String

dataURL。

(static) checkNodeCanScroll(el) → {Boolean}

判断节点内部是否可以滚动

Source:
Parameters:
Name Type Description
el HTMLElement

html 节点
Returns:
Type:
Boolean

trye or false

(static) checkPageCanScroll() → {Boolean}

判断页面是否可以滚动

Source:
Returns:
Type:
Boolean

trye or false

(static) cutText(text, length) → {String}

截断文字添加省略号，单位长度为一个汉字长度。

Source:
Parameters:
Name Type Description
text String

字符
length Number

长度，以一个汉字长度为单位
Returns:
Type:
String

截断后的字符

Example
cutText('xxxyyy', 2)
// xxxy

(static) dataURLToBlob(dataURL) → {Blob}

dataURL 转换为 blob 对象。

Source:
Parameters:
Name Type Description
dataURL String

dataURL。
Returns:
Type:
Blob

Blob 对象。

(async, static) downloadImg(src, imgName, useType)

下载图片。
依赖于 a 标签的 download 兼容性，移动端兼容性差。

Source:
Parameters:
Name Type Description
src String

图片链接，可以是blob url, dataURL, 网络图片（http开头）。
imgName Number

图片名字。
需要加上格式，同时原图片是什么格式，这里就必须是什么格式。
useType Number

可选值为 dataURL 或者 blobURL，表示转换为哪种格式下载。
仅对 dataURL, 网络图片 有效，本身为 blobURL 不可转换。
如果是网络图片，不转换成 dataURL 或者 blobURL 无法跨域下载。

(static) getPixelRatio() → {Number}

获取 canvas 存储的像素比 和 屏幕像素比比值 。

即如果比值为x，那么canvas的真正大小（width属性）应该是：css像素*x。

Source:
Returns:
Type:
Number

比值。

(static) hiddenRows(el, rowsopt, exceededRowsopt) → {Object}

文本超出指定行后隐藏。
因为使用了 getComputedStyle 获取高度，所以节点不能是内联节点。

Source:
Parameters:
Name Type Attributes Default Description
el HTMLElement

html节点。
rows Number <optional>
 5

指定的行数。
exceededRows Number <optional>
 0

超出 指定行数 多少行 后才隐藏。
Returns:
Type:
Object

对象，包括是否隐藏的标志和文本高度。

Example
hiddenRows (el, 6, 2)
// 表示超过 6+2 行后才隐藏
// 隐藏后的行数显示为6行
// {
//   hidden: false or true,
//   height: 文本高度
// }

(static) HTMLDecode(str) → {String}

解析转义后的html。

Source:
Parameters:
Name Type Description
str String

转义后的字符串html。
Returns:
Type:
String
  • 字符串形式的html。
Example
HTMLEncode('&lt;div&nbsp;class=&quot;&quot;&gt;&nbsp;xx&nbsp;&lt;/div&gt;')
// <div class=""> xx </div>

(static) HTMLEncode(str) → {String}

HTML转义。

Source:
Parameters:
Name Type Description
str String

字符串形式的html。
Returns:
Type:
String
  • 转义后的字符串html。
Example
HTMLEncode('<div class=""> xx </div>')
// &lt;div&nbsp;class=&quot;&quot;&gt;&nbsp;xx&nbsp;&lt;/div&gt;

(static) infiniteScroll(options) → {Object}

无限滚动。

Source:
Parameters:
Name Type Description
options Object

配置参数。

Name Type Attributes Default Description
el HTMLElement <optional>
 document.documentElement

无限滚动的节点。
callback function

回调函数。
distance Number <optional>
 0

距离底部多少调用回调函数。
Returns:
Type:
Object

对象，包含摧毁监听的方法 destory。

Example
// const ins = infiniteScroll({
//   el: 'html节点',
//   distance: 10,
//   callback: () => {
//     console.log('a')
//   }
// })

// ins.destory()

(static) insertScripts(scripts, container)

插入字符串形式的 script 标签。

Source:
Parameters:
Name Type Description
scripts String | Array

字符串形式的 script 标签。
container HTMLElement

插入到的节点容器。
Example
insertScripts('<script></script><script></script>')
insertScripts(['<script></script><script></script>','<script></script>'])

(static) urlToDataURL(url) → {String}

图片 url 转换为 dataURL。

Source:
Parameters:
Name Type Description
url String

图片 url。
Returns:
Type:
String

dataURL。