javascript – 插入跨度后将文本节点合并在一起

我有一个扩展,我正在存储/检索用户选择的DOM结构的一部分(总是屏幕上的文本选择)。当我存储选择时,我将该部分包含在SPAN标签中,并以黄色突出显示文本。这导致所选文本周围的DOM结构分解成各种文本节点。这对我来说是一个问题,因为当我尝试恢复此选择(不刷新页面)时,会导致问题,因为DOM结构已被修改。

我的问题是如何在插入SPAN后阻止DOM结构分解?如果无法实现这一点,在将SPAN标签移除到原始状态后,如何重新组合DOM结构?

//Insert the span
var sel = restoreSelection(mootsOnPage[i].startXPath);
var range = sel.getRangeAt(0).cloneRange();
var newNode = document.createElement('span');
newNode.className = 'highlightYellow';
range.surroundContents(newNode); 


//Original DOM structure
<p>Hello there, how are you today</p>


//What the DOM looks like after insertion of SPAN
<p>
  "Hello there, "
  <span class="highlightYellow">how</span
  " are you today"
</p>
您可以使用它来打开您的内容。

$(".highlightYellow").contents().unwrap(); 

演示:http://jsfiddle.net/R4hfa/

http://stackoverflow.com/questions/9849316/merging-text-nodes-together-after-inserting-span

本站文章除注明转载外,均为本站原创或编译
转载请明显位置注明出处:javascript – 插入跨度后将文本节点合并在一起