openlayers3 - 将节点设置为 ol.control.FullScreen 控件的标签

Question

我正在尝试将自定义跨度 (<span class="fa fa-expand"></span>) 设置为 openlayers 3 FullScreen 控件的标签。

根据文档，这应该是可能的。文档指出：

标签字符串 |节点 |未定义的实验性

用于按钮的文本标签。默认为 \u2922（东北和 西南箭头）。除了文本，还有一个节点（例如 span 元素） 可以使用。

我尝试这样设置标签：

let fullScreenControl = new ol.control.FullScreen({
     className: 'fullScreen-button',
     label: '<span class="fa fa-expand"></span>'
});

但这似乎对我的标签进行了 html 编码。当我在开发者控制台中检查生成的按钮时，它会添加<span> ...

有人可以指导我如何将“节点”设置为标签，或者通常将自定义跨度设置为控件标签的正确方法吗？谢谢

Answer 1

你需要创建一个元素对象：

var mySpan = document.createElement("span");
mySpan.className = "fa fa-expand";

var fullScreenControl = new ol.control.FullScreen({
  className: 'fullScreen-button',
  label: mySpan
});