Rangy（JS/jQuery）分割ノード

Question

どのようにノード/要素をある位置（選択）に分割しますか？

<p>This is <a href="">a te|st</a>, you like?</p> 

は（このパイプは、位置/選択を表します）、私はそれを変換したい

：選択を維持

<p>This is <a href="">a te</a></p>|<p><a href="">st</a>, you like?</p> 

例私はこのマークアップを持っています。

アイデア？

IとRangyライブラリを使用し、jQueryも使用できますが、該当する場合は生JSを使用できます。

Answer 1

キャレットから段落の直後までの範囲を作成し、そのextractContents()メソッドを使用して範囲を作成すると、これを行うことができます。

ライブデモ：http://jsfiddle.net/timdown/rr9qs/2/

コード：

var sel = rangy.getSelection(); 
if (sel.rangeCount > 0) { 
    // Create a copy of the selection range to work with 
    var range = sel.getRangeAt(0).cloneRange(); 

    // Get the containing paragraph 
    var p = range.commonAncestorContainer; 
    while (p && (p.nodeType != 1 || p.tagName != "P")) { 
     p = p.parentNode; 
    } 

    if (p) { 
     // Place the end of the range after the paragraph 
     range.setEndAfter(p); 

     // Extract the contents of the paragraph after the caret into a fragment 
     var contentAfterRangeStart = range.extractContents(); 

     // Collapse the range immediately after the paragraph 
     range.collapseAfter(p); 

     // Insert the content 
     range.insertNode(contentAfterRangeStart); 

     // Move the caret to the insertion point 
     range.collapseAfter(p); 
     sel.setSingleRange(range); 
    } 
}