一つの関数で画像や色を変更するには？

質問

こんにちは、いつもお世話になっています。
以前親ウィンドウのHTMLの内容をテキストエリアに表示する
と言う内容に付いて質問をさせて頂きました。
今作成しているのは子ウィンドウから親ウィンドウの
任意の場所の画像や背景色、テキストの内容をテキストで変更するというものです。
その後作業をすすめてまいりましたがふと思いました。
すべて
window.opener.document.getElementById
が共通で
その後にstyle.backgroundColorやimage.src、innerHTMLが続くだけです。
そこで今は色変更、画像変更、テキスト変更と関数に分けていますが
ひとつの関数でそれをできないかと思ったのです。
たとえばなにか引数としてimage.srcを渡すと
window.opener.document.getElementById(1).A=○○;
のAにimage.srcが自動的にはいって画像変更ができるようになる
と言う風なことはできないのでしょうか？
もし可能だとしたら代入する値が画像であるか、色名であるかと言った判定も
やはりしていくべきでしょうか？
どなたか宜しくお願い致します。

回答No.2

noname#23734 · ベストアンサー

色変更、画像変更は共通でできます。
setAttribute(AttName,Attval)
AttName,Attvalを変更するようにしたら如何ですか？
ただしstyle属性の場合IE6は、style.cssTextを使います。
Firefox,Opera8では普通にsetAttribute('style','color:red')のようにすると良いです。
http://www3.tokai.or.jp/janboon/samp/javascript/hoka/h3.html

例えば、
ブラウザ判別が入って
AttName=document.body.getElementsByTagName('input')[0].value
Attval=document.body.getElementsByTagName('input')[1].value
if(BR == IE&&AttName == 'style'){
window.opener.document.getElementById(1).style.cssText = Attval
}else{
window.opener.document.getElementById(1).setAttribute(AttName,Attval)
}
こんな感じになるんでしょうかね。

イベント属性の場合もIE6はsetAttribute('onclick',function(){alert('a')})などのように引用符を使わずに書きます。
Firefox,Opera8では普通にsetAttribute('onclick',"alert('a')")のようにすると良いようです。

テキストの変更は属性ではないので共通ではできないと思います。

ただデータの入力方法が不明なのでなんとも言えませんけどね。
テキスト専用のtextareaがあって属性専用のinputタグがあるならtextareaが空ならsetAttributeをやってinputが空ならchildNodesを検索してそのnodeValueがnullでなければそれのnodeValueを変更すれば1つの関数でできるんじゃないでしょうか。

回答No.1

yambejp

たとえばこんなかんじ

<script language=javascript>
function test(v){
switch(v){
case 1:
document.getElementById('test').innerHTML="<image src='images/am.gif'>"
break;
case 2:
document.getElementById('test').innerHTML="テストテストテスト"
break;
case 3:
document.getElementById('test').innerHTML="テストテストテスト"
document.getElementById('test').style.backgroundColor="#ff0000";
break;
}
}
</script>
<form>
<input type=button value="画像" onClick="test(1)">
<input type=button value="文字を書く" onClick="test(2)">
<input type=button value="文字の背景赤" onClick="test(3)">
<div id="test"></div>
<form>