及川WEB室|ホームページ制作

HTML、CSS、JavaScript、スマートフォンサイト、Facebookなど、サイト制作に関する事をメモしています。
個人的な備忘録です。
及川WEB室 ホームページ制作HOME
及川WEB室 > JavaScript > Mozilla Firefox で innerText が効かない

Mozilla Firefox で innerText が効かない

FirefoxではJavaScript で innerTextが機能しない場合が有る模様。
解決策をGoogleで調べてみたら、検索結果件数がたくさんあった。困っている人が結構多そう。
解決策: textContent を併記したら、Firefox (ver.11.0 で確認)でも機能した。

JavaScript サンプル

HTML内の文字を入れ替える JavaScript のサンプル。
innerText と textContent を併用した例。
サンプル4行目の「cCode.textContent = str;」が無いと、IE9では機能したが、Firefox(v11.0)では機能しなかった。
function changetxt(txtID,str){
var cCode = document.getElementById(txtID);
cCode.innerText = str;
cCode.textContent = str;	//Firefox 対策。
}

HTMLソースコード サンプル

a タグの onclickの「changetxt('ccodetxt','#00CCFF');」で changetxt関数を動かす。
changetxt関数で、id="txt" のレイヤータグ内の文字を入れ替える。
changetxt関数に、textContentを併記してある。

HTML
[ ここに色見本とカラーコード名が表示されます。 ]
#00CC00 #FF0000 #00CCFF
Javascript
function changetxt(txtID,str){
var cCode = document.getElementById(txtID);
cCode.innerText = str;
cCode.textContent = str;	//Firefox対策。
}

サンプルHTML

実際のサンプルを見る
MENU Ξ