javascript – 如何用HTML标签包装跨界DOM选择范围?

栏目: Html · 发布时间: 6年前

内容简介:em>标签.然而,在这个例子中,当用户从Foo到Baz进行文本选择时,我无法调用range.surroundContents:Firefox失败,范围的边界点不符合特定要求.“code:”1,因为选择不是有效的HTML.
现在我通过s = window.getSelection()和range = s.getRangeAt(0)(浏览器的隐含)来捕获用户的文本选择.每当<p>内的选择做了,我可以轻松地调用range.surroundContents(document.createElement(“em”)),使选定的文本用<

em>标签.

然而,在这个例子中,

<p>This is the Foo paragraph.</p>
<p>This is the Bar paragraph.</p>
<p>This is the Baz paragraph.</p>

当用户从Foo到Baz进行文本选择时,我无法调用range.surroundContents:Firefox失败,范围的边界点不符合特定要求.“code:”1,因为选择不是有效的HTML.

在这种情况下,我想以某种方式在DOM中获取以下状态:

<p>This is the <em>Foo paragraph.</em></p>
<p><em>This is the Bar paragraph.</em></p>
<p><em>This is the Baz</em> paragraph.</p>

有任何想法吗?

FYI:我一直在尝试使用Range API,但我看不到直接的方式来实现这一结果.同

var r = document.createRange();
r.setStart(range.startContainer, range.startOffset);
r.setEnd(range.endContainer, range.endOffset+40);
selection.addRange(r);

我最终可以通过重新定位偏移来劫持某些东西,但只能用于“开始”和“结束”容器! (即在这种情况下,Bar段落,我该如何包装?)


以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

Convergence Culture

Convergence Culture

Henry Jenkins / NYU Press / 2006-08-01 / USD 30.00

"Convergence Culture" maps a new territory: where old and new media intersect, where grassroots and corporate media collide, where the power of the media producer, and the power of the consumer intera......一起来看看 《Convergence Culture》 这本书的介绍吧!

Base64 编码/解码
Base64 编码/解码

Base64 编码/解码

html转js在线工具
html转js在线工具

html转js在线工具

HSV CMYK 转换工具
HSV CMYK 转换工具

HSV CMYK互换工具