Code: Select all
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ko">
<head>
<title>새 문서</title>
<meta http-equiv="content-type" content="text/html; charset=euc-kr"/>
<style type="text/css">
</style>
<script type="text/javascript">
function go()
{
var prefix = "<span style=\"background-color: #aaa\">[[";
var postfix = "]<strong>]</strong></span>";
if(navigator.appName == "Microsoft Internet Explorer")
{
var range = document.selection.createRange();
range.pasteHTML(prefix + range.htmlText + postfix);
}
else
{
var range = window.getSelection().getRangeAt(0);
// ????
}
}
</script>
</head>
<body>
<button onclick="go()">GO</button>
<div id="test">Strings Strings Strings Strings Strings Strings Strings Strings</div>
</body>
</html>
처음 생각한 방법은 range.startOffset, range.endOffset을 가지고 전체 html 문자열을 자르고 붙이는 거였는데 한글이 포함돼 있을 경우 정확히 잘라지지 않는 문제가 있어 포기했습니다.
두번째 방법은,
Code: Select all
var selected = range.extractContents();
range.insertNode(range.createContextualFragment(prefix + ???? + postfix));selected는 DocumentFragment 오브젝트라는데요 DocumentFragment 내부의 HTML을 뽑아내는 메소드가 있을법도 한데.. Gecko DOM Reference를 뒤져봤지만 검색실력이 딸려서 원하는 정보를 찾기가 어렵네요..
요약하자면.. DocumentFragment 오브젝트에 딸려있는 Properties, Methods를 알고 싶습니다. DocumentFragment 오브젝트 내부의 HTML 코드를 뽑아내는 방법도요..