Leaflet API - DomUtil 中文文档

发布时间: 2022-10-18 所属分类: 文章标签:

当前位置：

麻辣GIS » GIS手册 » Leaflet中文API手册（V1.9） » Leaflet API - DomUtil 中文文档

本文介绍下 Leaflet 中 DomUtil API的详细使用说明。

DomUtil API 调用方法

在 Leaflet 内部用于处理 DOM 树的实用函数。

大多数期望或返回 HTMLElement 的函数也适用于 SVG 元素。唯一的区别是，类是指 HTML 中的 CSS 类，而 SVG 中的 SVG 类。

Functions

Function	返回值	说明
`get(<String\|HTMLElement> id)`	`HTMLElement`	返回一个给定的 DOM ID 的元素，如果是直接传递，则返回元素本身。
`getStyle(<HTMLElement> el, <String> styleAttrib)`	`String`	返回一个元素上的某个样式属性的值。包括计算值或通过 CSS 设置的值。
`create(<String> tagName, <String> className?, <HTMLElement> container?)`	`HTMLElement`	用 `tagName`创建一个HTML元素，将它的类设置为 `className`，并可选择将其附加到 `容器` 元素中。
`remove(<HTMLElement> el)`		将 `el` 从其父元素中移除
`empty(<HTMLElement> el)`		从 `el`中删除所有 `el`的子元素
`toFront(<HTMLElement> el)`		使 `el` 成为其父级的最后一个子级，因此它在其他子级之前渲染。
`toBack(<HTMLElement> el)`		使 `el` 成为其父级的第一个子级，因此它渲染在其他子级之后。
`hasClass(<HTMLElement> el, <String> name)`	`Boolean`	如果该元素的 class 属性包含该 `class 类名`，返回 `true` 。
`addClass(<HTMLElement> el, <String> name)`		将该 `class 类名`添加到元素的 class 属性中。
`removeClass(<HTMLElement> el, <String> name)`		从元素的 class 属性中删除 `class 类名`。
`setClass(<HTMLElement> el, <String> name)`		设置元素的 class 类名。
`getClass(<HTMLElement> el)`	`String`	返回元素的 class 类名。
`setOpacity(<HTMLElement> el, <Number> opacity)`		设置一个元素的不透明度（包括旧的IE支持）。 `opacity` 必须是一个从 `0` 到 `1`的数字。
`testProp(<String[]> props)`	`String\|false`	遍历样式名称的数组，并返回第一个对一个元素有效的样式名称。如果没有找到这样的名字，它将返回false。对于像 `transform`这样的供应商固定的样式很有用。
`setTransform(<HTMLElement> el, <Point> offset, <Number> scale?)`		重置 `el` 的3D CSS Transform，使其按偏移像素进行 `平移` ，并可选择按比例 `缩放`。如果浏览器不支持3D CSS Transform，则不会产生影响。
`setPosition(<HTMLElement> el, <Point> position)`		将 `el` 的位置设置为由 `position` 指定的坐标，根据浏览器使用CSS translate 或 top/left 定位（Leaflet 内部用来定位其图层）。
`getPosition(<HTMLElement> el)`	`Point`	返回之前用 setPosition 设置的元素的坐标。
`disableTextSelection()`		阻止用户生成 `selectstart` DOM 事件，通常在用户通过带有文本的页面拖动鼠标时生成。由 Leaflet 在内部使用以覆盖地图上任何点击和拖动交互的行为。影响整个文档上的拖动交互。
`enableTextSelection()`		取消之前 `L.DomUtil.disableTextSelection`的效果。
`disableImageDrag()`		如同 `L.DomUtil.disableTextSelection`，但用于 `dragstart` DOM事件，通常在用户拖动图片时产生。
`enableImageDrag()`		取消之前 `L.DomUtil.disableImageDrag` 的效果。
`preventOutline(<HTMLElement> el)`		使元素 `el` 的轮廓不可见。由 Leaflet 在内部使用，以防止可聚焦元素在用户对它们执行拖动交互时显示轮廓。
`restoreOutline()`		取消之前 `L.DomUtil.preventOutline` 的效果。
`getSizedParentNode(<HTMLElement> el)`	`HTMLElement`	找到尺寸（宽和高）不为空的最近的父节点。
`getScale(<HTMLElement> el)`	`Object`	计算当前应用在该元素上的CSS比例。返回一个对象，其 `x` 和 `y` 成员分别是水平和垂直比例，而 `boundingClientRect` 是 `getBoundingClientRect()` 的结果。

Properties 属性

属性	类型	说明
`TRANSFORM`	`String`	供应商前缀的转换样式名称 (例如，Webkit 的 `'webkitTransform'` )。
`TRANSITION`	`String`	供应商前缀的过渡样式名称。
`TRANSITION_END`	`String`	供应商前缀的 transitionend 事件名称。