掲示板/JavaScript質問板/過去ログ/一覧/ タグの外側だけ対象に置換する(IE DOM)

0 名前： yoro ： 2006/08/21（月） 07:33 ID:UkbhveQ3: IE上に表示されているhtmのタグの外側だけ対象に英字を太字に置換しようとしています。

http://www.din.or.jp/~ohzaki/regex.htm#ReplaceOutside

を参考に考えているのですが、\Gが使えなくて前回置換した場所から次のタグが始まる前の場所
に対しての置換がうまく行きません。

つまり
 あいうえおAAAかきくけこBBBさしすせそCCC 
ならば、
 あいうえおAAAかきくけこBBBさしすせそCCC 
としたいのですが、最初のAAAしか置換できません。　↓
 あいうえおAAAかきくけこBBBさしすせそCCC 

なにか良い方法は無いでしょうか？

宜しくお願いします。

1 名前： sevi- ： 2006/08/21（月） 07:33 ID:PQukhZTw

ループ処理内で正規表現オブジェクトの静的プロパティ、RegExp.rightContext を参照して検索対象の文字列を
順次差し替えていけば望む処理が可能と思われる.

とりあえずＤＯＭを用いて変換処理を行う処理と組み合わせた例を以下に示す.

sevi-

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Untitled Page</title>
   <script type="text/javascript">
   //引数のノード内の全テキストノードを配列に格納し返す.
   function getTextNodes(node)
   {
			function setTextNodes(node, list_text)
			{
				if(node.nodeType == null)
					return;	
				switch(node.nodeType)
				{
					case 3:
						list_text.push(node);					
						break;
					case 1:
					case 9:
						var nodes = node.childNodes;
						for(var i=0; i<nodes.length; i++)
							setTextNodes(nodes[i], list_text);
						break;
					default:
						break;
				}
			}
			var list_text = new Array();
			setTextNodes(node, list_text);
			return list_text;
   }
   //引数のノード内の全テキストノードの英文字を太字要素で囲む.
   function tranceBold_EnglishTextOnly(node_target)
   {
		var nodes = getTextNodes(node_target);
		var reg = new RegExp("[a-zA-Z]+");
		var node;var text;
		for(var i=0; i<nodes.length; i++)
		{
			node = nodes[i];
			if(node.parentNode.nodeName.toLowerCase() == "b")
				continue;
			text = node.nodeValue;
			if(text.match(reg))
			{
				while(text.match(reg))
				{
					node.parentNode.insertBefore(node.ownerDocument.createTextNode(RegExp.leftContext), node);
					node.parentNode.insertBefore(node.ownerDocument.createElement("b"), node).appendChild(node.ownerDocument.createTextNode(RegExp.lastMatch));
					text = RegExp.rightContext;
				}
				node.parentNode.removeChild(node);
			}
		}
   }
   </script> 
</head>
<body onload="tranceBold_EnglishTextOnly(document.getElementById('test'));">
	<div id="test"><span>あああtestああtttあ</span>おkおk</div>
</body>
</html>

2 名前： yoro ： 2006/08/21（月） 07:33 ID:UkbhveQ3: sevi-さん、サンプルまでご呈示いただきありがとうございます。

DOMでの列挙ならば、テキスト中にもしも"<"、">"記載されている場合でも
正確に判断できそうですね。

一方、ユーザータグが記載された場合にはどうなるのか疑問が残ります。

後で、検証させていただきます。

この質問はとりあえず解決とさせていただきます。

ありがとうございました。