☰

'innerText' は IE では動作しますが、Firefox では動作しません。質問する

tag-icon • tag-icon javascript internet-explorer firefox cross-browser
'innerText' は IE では動作しますが、Firefox では動作しません。質問する

IE で動作する次の JavaScript コードがあります。

myElement.innerText = "foo";

ただし、'innerText' プロパティは Firefox では機能しないようです。Firefox に相当するものはありますか? または、より汎用的で、ブラウザー間で使用できるプロパティはありますか?

ベストアンサー1

更新：私は書いたすべての違いを詳しく説明したブログ投稿ずっといい。

Firefox は W3C 標準を使用しますNode::textContentが、その動作は MSHTML 独自の動作とは「わずかに」異なりますinnerText(Opera も、しばらく前に他の数十の MSHTML 機能とともにこれをコピーしました)。

まず、textContent空白の表現が異なりますinnerText。次に、より重要な点として、innerTexttextContent には SCRIPT タグの内容がすべて含まれますが、innerText には含まれません。

物事をもっと面白くするために、Opera は標準を実装するだけでなくtextContent、MSHTML も追加することを決定しましたinnerText が、それを次のように動作するように変更しました。つまり、SCRIPT コンテンツを含めるように変更しましたtextContent(実際、textContentOperainnerTextでは、おそらく互いにエイリアスされているだけなので、同じ結果が生成されているようです)。

textContentNodeはインターフェースの一部ですが、innerTextは の一部ですHTMLElement。これは、たとえば、テキスト ノードからは「取得」できtextContentないことを意味します。innerText

var el = document.createElement('p');
var textNode = document.createTextNode('x');

el.textContent; // ""
el.innerText; // ""

textNode.textContent; // "x"
textNode.innerText; // undefined

最後に、Safari 2.x にもバグのあるinnerText実装があります。Safari では、innerText要素が ( によってstyle.display == "none") 非表示になっていないか、ドキュメントから孤立していない場合にのみ、 は適切に機能します。それ以外の場合は、innerText空の文字列になります。

私は抽象化を試みたがtextContent（これらの欠陥を回避するために）、結局かなり複雑。

最初に正確な要件を定義し、そこから進めるのが最善策です。すべての可能性のある逸脱innerHTMLに対処するのではなく、要素からタグを削除するだけで済む場合がよくあります。textContentinnerText

もちろん、別の可能性としては、DOM ツリーをたどってテキスト ノードを再帰的に収集することが挙げられます。

おすすめ記事