livedoor ナレッジ

関数をまとめたいです

function underline(){
if(document.all){ //IE
var str=document.selection.createRange().text;
if (str != "") {
document.selection.createRange().text="<u>" + str + "</u>";
} else {
document.form1.CBBE_TEXT.value += "<u></u>"
}
} else { //Firefox
var el=document.getElementById('text');
var sPos = el.selectionStart;
var ePos = el.selectionEnd;
var str = el.value.substring(sPos, ePos);
el.value = el.value.substring(0, sPos) +
"<u>" + str + "</u>" + el.value.substr(ePos);
}
}
と
function green(){
if(document.all){ //IE
var str=document.selection.createRange().text;
if (str != "") {
document.selection.createRange().text="<font color=\"#009900\">" + str + "</font>";
} else {
document.form1.CBBE_TEXT.value += "<font color=\"#009900\"></font>"
}
} else { //Firefox
var el=document.getElementById('text');
var sPos = el.selectionStart;
var ePos = el.selectionEnd;
var str = el.value.substring(sPos, ePos);
el.value = el.value.substring(0, sPos) +
"<font color=\"#009900\">" + str + "</font>" + el.value.substr(ePos);
}
}
をひとつの関数にまとめることは出来ないでしょうか？
教えてください

ちょっと内容は違うのですが、div(span)の内容にタグを入れて書き換えるのではなく、スタイルをいじった方が正攻法な気がするので、そちらのコードを示します。

JS部分：

function changeStyle(col,stl){
 dgText=document.getElementById('text');
 if(col!="")
   dgText.style.color=col;
 if(stl=="u")
   dgText.style.textDecoration="underline";
 else if(stl=="i")
   dgText.style.fontStyle="italic";
 else if(stl=="b")
   dgText.style.fontWeight="bold";
 else if(stl=="r"){//RESET
   dgText.style.color="#000000";
   dgText.style.textDecoration="none";
   dgText.style.fontStyle="normal";
   dgText.style.fontWeight="normal";
 }
}

使用例：

<input type="button" value="太字" onClick="changeStyle('','b');">
<input type="button" value="斜体" onClick="changeStyle('','i');">
<input type="button" value="アンダーライン" onClick="changeStyle('','u');">
<input type="button" value="緑" onClick="changeStyle('#00FF00','');">
<input type="button" value="リセット" onClick="changeStyle('','r');">

changeStyle(arg1,arg2)は、arg1に色、arg2にスタイルを指定します。

onClick="changeStyle('#FFFFFF','b');"

とすると、id="text"が、白の太字になります。
arg2に使えるのは、
'u':アンダーライン
'b'：太字
'i'：イタリック
'r'：リセット
です。他は無視されます。

もし、onClickの部分を全部全く同じに書きたいというのであれば、thisを関数に渡してあげて、this.valueでボタンのラベル名を判断してやれば、統一することもできますが、ラベルを変えたときに関数側も変更しなければならなくなるので、やっていません。