Skip to content

HTML经过cloneNode拷贝出来的话,无法取得换行信息 #79

@openHacking

Description

@openHacking

我用getSelection和selectAllChildren获取一个HTML元素的内容(带换行信息)

// working
var sel = window.getSelection();
sel.selectAllChildren(element);

但是如果HTML经过cloneNode拷贝出来的话,无法取得换行信息,如下代码所示,如何修复?

// not working
element = originElement.cloneNode(true)
var sel = window.getSelection();
sel.selectAllChildren(element);

当您使用cloneNode函数复制一个元素时,它只会复制该元素的属性和文本内容,而不会复制其样式或其他DOM属性。因此,它不会包含任何与该元素相关的选择或范围对象。

解决此问题的一种方法是使用innerHTML属性来复制元素,这将复制元素及其所有子元素,包括文本节点和换行符。以下是一个示例代码,可以将元素及其子元素的内容复制到一个新的div元素中:

var clonedElement = originElement.cloneNode(true);
var wrapper = document.createElement('div');
wrapper.appendChild(clonedElement);

var sel = window.getSelection();
sel.selectAllChildren(wrapper);

这将在新的div元素中创建一个包含克隆元素及其所有子元素的树状结构,并使用getSelection()selectAllChildren()函数选择该结构。由于这个新的div元素与原始元素在结构上相同,因此它应该包含与原始元素相同的文本内容,包括所有换行符。

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions