javascript - How to remove all nodes from selected ranges - Stack Overflow

admin管理员组

文章数量:1316030

For example, I have such text:

Some test <span> in span1</span> sss <span>in span2</span> end of text.

when I select " test in span1 sss in spa" I want to just delete parent spans of selected ranges and create new range that will contain my selected text.

Some<span> test in span1 sss in spa</span>n2 end of text.

I'm using window.getSelection(),range,nodes

Please help!

For example, I have such text:

Some test <span> in span1</span> sss <span>in span2</span> end of text.

when I select " test in span1 sss in spa" I want to just delete parent spans of selected ranges and create new range that will contain my selected text.

Some<span> test in span1 sss in spa</span>n2 end of text.

I'm using window.getSelection(),range,nodes

Please help!

• javascript
• range
• selection

Share Improve this question Follow edited Mar 5, 2013 at 5:29 Iswanto San 18.6k1313 gold badges6060 silver badges7979 bronze badges asked Mar 5, 2013 at 5:28 Anuar SharafudinovAnuar Sharafudinov 10922 silver badges99 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 9

You can do this with the deleteContents(), toString() and insertNode() methods of a range obtained from the selection.

The following will work in all major browsers except IE <= 8. You'll need a different approach for those browsers, which I can outline if you need it.

Demo: http://jsfiddle/HUm2K/

Code:

var sel = window.getSelection();
if (sel.rangeCount > 0) {
    var range = sel.getRangeAt(0);
    var newSpan = document.createElement("span");
    var selectedTextNode = document.createTextNode( range.toString() );
    newSpan.appendChild(selectedTextNode);
    range.deleteContents();
    range.insertNode(newSpan);
    range.selectNode(newSpan);
    sel.removeAllRanges();
    sel.addRange(range);
}

本文标签： javascriptHow to remove all nodes from selected rangesStack Overflow