web-dev-qa-db-ja.com

自己終了スクリプト要素が機能しないのはなぜですか?

ブラウザが正しく認識しない理由は何ですか。

<script src="foobar.js" /> <!-- self-closing script element -->

これだけが認められています。

<script src="foobar.js"></script>

これはXHTMLサポートの概念を破りますか?

注意:この記述は少なくともすべてのIE(6-8 beta 2)に当てはまります。

1247
dimarzionist

XHTML 1仕様には次のように記載されています。

С.3。要素の最小化と空の要素の内容

コンテンツモデルがEMPTYではない要素の空のインスタンス(たとえば、空のタイトルや段落)がある場合は、最小化された形式を使用しないでください(例:<p> </p>を使用し、<p />は使用しないでください)。

XHTML DTD は、スクリプト要素を次のように指定します。

<!-- script statements, which may include CDATA sections -->
<!ELEMENT script (#PCDATA)>
456
squadette

Bradとsquadetteが言ったことに加えて、自己完結型のXML構文<script /> actually正しいXMLです。 HTTP Content-Typeヘッダーのapplication/xhtml+xmlのようなXML MIMEタイプ(およびnottext/html)。

ただし、XML MIMEタイプを送信すると、ページはIE7によって解析されません。これは、text/htmlのみが好きです。

から w3

要約すると、 'application/xhtml + xml'はXHTMLファミリー文書に使用されるべきであり(SHOULD)、 'text/html'の使用はHTML互換のXHTML 1.0文書に限定されるべきである(SHOULD)。 'application/xml'と 'text/xml'も使用できますが、適切な場合は常に、これらの一般的なXMLメディアタイプではなく 'application/xhtml + xml'を使用する必要があります。

私は数ヶ月前にこれについて戸惑いました、そして唯一の実行可能な(FF3 +とIE7と互換性のある)解決策は<script></script>(HTML構文+ HTML mimetype)と共に古いtext/html構文を使うことでした。

サーバーがHTTPヘッダーでtext/htmlタイプを送信すると、それ以外の方法で正しく作成されたXHTML文書でも、FF3 +はそのHTMLレンダリングモードを使用します。これは<script />が機能しないことを意味します。

これは、http-equiv meta要素、XMLプロローグ、または文書内のDoctypeをいじることにかかわらず発生します。Firefoxは、text/htmlヘッダーを取得すると分岐し、HTMLパーサーまたはXMLパーサーが文書内を検索するかどうかを決定します。 <script />を理解する。

225
joelhardi

好奇心旺盛な人のために、究極の理由はHTMLが元々SGMLの方言だったことであり、それはXMLの奇妙な兄です。 SGMLランドでは、要素は、自己閉鎖的(例えば、BR、HR、入力)、暗黙的に接近可能(例えば、P、LI、TD)、または明示的に接近可能(例えば、TABLE、DIV、SCRIPT)としてDTDにおいて特定され得る。 XMLにはもちろんこれの概念はありません。

最近のブラウザで使用されていたタグスープパーサはこの遺産から発展したものですが、それらの解析モデルはもはや純粋なSGMLではありません。そしてもちろん、あなたが注意深く作られたXHTMLは、あなたがXML mimeタイプでそれを送らない限り、SGMLに触発されたタグ・スープとして書かれたものではありません。これも理由です...

<p><div>hello</div></p>

...ブラウザによって次のように解釈されます。

<p></p><div>hello</div><p></p>

...これは、あなたがDOMに対してコーディングしようとしているときにあなたをフィットさせることができる、あいまいなバグのレシピです。

150
greim

他の人は「方法」と答え、仕様を引用しています。バグレポートとメーリングリストを何時間も掘り下げた後、「なぜ<script/>」なのかという本当の話があります。


HTML 4

HTML 4は SGML に基づいています。

SGMLには、<BR//<B>text</><B/text/、または<OL<LI>item</LI</OL>など、いくつかの ショートタグ があります。 XMLは最初の形式を取り、末尾を ">"として再定義します(SGMLは柔軟です)。そのため、<BR/>になります。

ただし、HTMLは再定義されなかったため、<SCRIPT/>should mean<SCRIPT>>となります。
(はい、「>」はコンテンツの一部である必要があり、タグはまだnot closedです。)

明らかに、これはXHTMLと互換性がなく、will多くのサイトを破壊します(ブラウザーが十分に成熟するまでに 気にするこれについて )、そうです- ショートタグは誰も実装していません と仕様 それらに助言する

事実上、すべての「機能する」自己終了タグは、技術的に不適合なパーサー上のオプションの終了タグを持つタグであり、実際には無効です。それはW3Cでした このハックを思いついた XHTMLへの移行を助けるために HTML互換 にしました。

<script>の終了タグは オプションではありません です。

「自己終了」タグはHTML 4のハックであり、無意味です。


HTML 5

HTML5には 5種類のタグ があり、 'void'および 'foreign'タグのみが 自己終了可能 です。

<script>はvoidではなく(MathMLやSVGのようにmayコンテンツを持つ)、外部ではないため、使用方法に関係なく<script>は自己クローズできません。 。

しかし、なぜ?彼らはそれを外国のものと見なしたり、特別なケースを作ったりすることはできませんか?

HTML 5は、HTML 4およびXHTML 1の 後方互換実装を目指しています。SGMLまたはXMLに基づいていません。その構文は、主に実装の文書化と結合に関係しています。 (これが<br/><hr/>などが 有効なHTML 5 である理由は、HTML4が無効であるにもかかわらずです。)

自己終了<script>は、実装が異なるタグの1つです。それ Chrome、Safariでの作業に使用およびOpera ;私の知る限り、Internet ExplorerやFirefoxでは機能しませんでした。

これは議論された HTML 5が起草され、それが拒否されたとき breaksbrowsercompatibility スクリプトタグを自己クローズするWebページは、古いブラウザでは正しく表示されない場合があります。 他の提案 がありましたが、互換性の問題も解決できません。

ドラフトがリリースされた後、WebKitはパーサーが準拠するように更新しました。

HTML 4およびXHTML 1との後方互換性のため、HTML 5では自己終了<script>は発生しません。


XHTML 1/XHTML 5

reallyがXHTMLとして機能する場合、 他の回答 が述べているように、<script/>は本当に閉じられます。

仕様に書かれている it shouldがHTMLとして提供された場合は機能していることを除いて:

XHTML Documentsは、ほとんどのHTMLブラウザと互換性があるため、インターネットメディアタイプ「text/html」[RFC2854]でラベル付けされる場合があります。

どうしたの?

人々 Mozillaに尋ねたFirefoxを解析させます 指定されたコンテンツヘッダーに関係なく XHTML に準拠するドキュメント( コンテンツスニッフィング )。これにより、自己閉鎖スクリプト、およびコンテンツスニッフィング 必要でした が許可されていました。Webホスティング業者は、正しいヘッダーを提供するほど成熟していないためです。 IEは 上手い でした。

最初のブラウザ戦争 がIE 6で終わっていなかった場合、XHTMLもリストに載っていた可能性があります。しかし、それは終わりました。そしてIE 6 問題がある XHTMLで。実際IE サポートしていません 正しいMIMEタイプ まったく 、強制的にeveryoneを使用してtext/htmlを使用しますXHTMLの理由は、IE 主要な市場シェアを持っていた 十年間。

また、コンテンツスニッフィング 可能本当に悪い で、人々は 停止する必要がある と言っています。

最後に、W3C XHTMLがスニッフィングできることを意味しなかった :文書はboth、HTMLとXHTML、およびContent-Typeルールです。彼らは「私たちの仕様に従うだけ」でしっかりと立っていたと言うことができます 実用的なものを無視して続き 以降のXHTMLバージョンへの誤り。

とにかく、この決定 問題を解決した Firefoxの場合。 Chrome 生まれた ;の7年前他に重要なブラウザはありませんでした。したがって、それは決定されました。

Doctypeのみを指定しても、次の仕様のためにXML解析はトリガーされません。

141
Sheepy

Internet Explorer 8以前はXHTML解析をサポートしていません。 XML宣言やXHTML Doctype、あるいはその両方を使用しても、old IEはドキュメントをプレーンHTMLとして解析します。そして普通のHTMLでは、自己終了構文はサポートされていません。末尾のスラッシュは無視されます。明示的な終了タグを使用する必要があります。

IE 9以降 のようにXHTML解析をサポートしているブラウザでも、XMLコンテンツタイプでドキュメントを提供しない限り、ドキュメントをHTMLとして解析します。しかしその場合、old IEはドキュメントをまったく表示しません。

44
JacquesB

上の人たちはすでにこの問題についてかなり説明していますが、HTML文書では<br/>などを常に使用していますが、そのような位置にある/は基本的に無視され、試行時にのみ使用されます。何かをXMLとHTMLの両方として解析可能にする。たとえば、<p/>foo</p>を試すと、通常の段落が表示されます。

26
Marijn

Scriptタグにはインラインコードを含めることができ、HTMLでは属性の存在に基づいてその機能を有効または無効にするのに十分なほどスマートではないため、自己終了スクリプトタグは機能しません。

一方、HTMLには外部リソースへの参照を含めるための優れたタグがあります。それは<link>タグであり、それは自己終了型にすることができます。スタイルシート、RSSやAtomフィード、正規のURI、その他あらゆる種類のものが含まれています。なぜJavaScriptではないのですか?

Scriptタグを自己同封したい場合は、私が言ったようにそれを行うことはできませんが、代わりの方法がありますが、賢い方法ではありません。自己終了リンクタグを使用して、JavaScriptとしてtext/javascriptとrelのタイプを指定することで、JavaScriptにリンクできます。

<link type="text/javascript" rel ="script" href="/path/tp/javascript" />
22
defau1t

XMLおよびXHTMLとは異なり、HTMLには自己終了構文に関する知識はありません。 XHTMLをHTMLとして解釈するブラウザは、/文字がタグが自動閉鎖であることを示すことを知りません。代わりにそれらは空の属性のようにそれを解釈し、パーサーはまだタグが「開いている」と考えます。

<script defer><script defer="defer">として扱われるのと同様に、<script /><script /="/">として扱われます。

20
rpetrich

Internet Explorer 8以前は、XHTMLの正しいMIMEタイプであるapplication/xhtml+xmlをサポートしていません。 XHTMLをtext/htmlとして提供している場合、これらの古いバージョンのInternet Explorerで何かを実行する必要がある場合は、HTML 4.01として解釈されます。終了タグを省略できる要素では、短い構文しか使用できません。 HTML 4.01仕様 を参照してください。

XMLの 'short form'は/という名前の属性として解釈されます。これは(等号がないため)暗黙の値 "/"を持つものとして解釈されます。これはHTML 4.01では厳密には間違っています - 宣言されていない属性は許可されていません - しかしブラウザはそれを無視します。

IE9以降 は、application/xhtml+xml付きのXHTML 5 をサポートします。

18
Mike Dimmick

これは、SCRIPT TAGが無効な要素ではないためです。

HTMLドキュメント-要素を無効にしますしない「終了タグ」が必要です!

xhtmlでは、すべてが汎用であるため、すべてが必要です終了例: 「終了タグ」; brを含む、単純な改行、<br></br>またはそのshorthand<br />として。

ただし、script tagが他の何かの前にあるのは、データ記述宣言ではなくブラウザー命令であるため、スクリプト要素は決してvoidまたはパラメーター要素ではありません。

主に、セマンティック終了命令、たとえば「終了タグ」は、後続のタグでセマンティクスを終了できない命令を処理するためにのみ必要です。例えば:

<H1>のセマンティクスを後続の<P>で終了することはできません。これは、それ自体のセマンティクスを無効にして以前のH1命令セットを終了するのに十分ではないためです。 streamを新しい段落行に分割することはできますが、現在のフォントサイズとスタイルの行の高さを上書きするほど「強力」ではありませんストリームを下る、つまり、H1からのリーク(Pにはないため)。

これが、「/」(終端)シグナリングが発明された方法と理由です。

< />のような一般的なno-description終了タグは、発生したカスケードからの単一のフォールオフで十分です。例:<H1>Title< />しかし、そうではない場合があります。これは、ストリームの複数の中間タグ付けを「ネスト」できるようにしたいためです。別のカスケードにラップ/フォールする前にトレントに分割します。結果として、< />などの汎用ターミネータは、終了するプロパティのターゲットを決定できません。例えば:<b>bold<i>bold-italic< />イタリック</>normal。間違いなく意図を正しく理解できず、おそらくboldbold-itallicbold normalと解釈するでしょう。

これが、ラッパーの概念、つまりコンテナが生まれた方法です。 (これらの概念は非常に似ているため、識別できず、時には同じ要素に両方がある場合があります。<H1>は同時にラッパーとコンテナーの両方です。一方、<B>はセマンティックラッパーのみです)。意味のないプレーンなコンテナが必要です。そしてもちろん、DIV要素の発明がやって来ました。

DIV要素は、実際には2BRコンテナです。もちろん、CSSの登場により、状況全体が奇妙になり、多くの大きな結果を伴う大きな混乱を引き起こしました-間接的に!

CSSを使用すると、新しく開発されたDIVのネイティブのpre&after BR動作を簡単にオーバーライドできるため、「do nothingコンテナー」と呼ばれることがよくあります。それは当然、間違っています! DIVはブロック要素であり、終了信号の前後でストリームの行をネイティブに分割します。すぐにWEBはページDIV-itisに苦しみ始めました。それらのほとんどはまだです。

HTMLタグのネイティブ動作を完全にオーバーライドして完全に再定義する機能を備えたCSSの登場により、何らかの形でHTMLの存在の意味全体を混乱させ、曖昧にすることができました...

突然、すべてのHTMLタグは時代遅れのように見え、改ざんされ、元の意味、アイデンティティ、目的がすべて取り除かれました。どういうわけか、それらはもはや必要ではないという印象を受けます。説明:単一のコンテナラッパータグで、すべてのデータ表示に十分です。必要な属性を追加するだけです。代わりに、意味のあるタグを用意してください。進むにつれてタグ名を作成し、CSSに気を配らせます。

これが、xhtmlが生まれた方法であり、もちろん、新しい素晴らしさによって心から支払われた、そして何が何であり、そのすべてのいまいましい目的は歪んだビジョンです。 W3CはWorld Wide Webから、何が間違っているのか、仲間たちに行きました!

HTMLの目的は、ストリーミングする人間の受信者にとって意味のあるデータです。

情報を配信する。

正式な部分は、情報配信の明確化を支援するためだけのものです。 xhtmlは、情報を少しも考慮しません。 -それには、情報は絶対に無関係です。

問題で最も重要なことは、xhtmlは単なる拡張HTMLのバージョンではないであることを理解し、理解できるようにすることです。xhtmlは完全に異なる獣です。根拠;したがって、それらを分離しておくのが賢明です。

5
Bekim Bacaj

'真のXHTML'、 '偽のXHTML'、およびHTMLの違い、およびサーバーが送信するMIMEタイプの重要性は 既にここで説明されています 。今すぐ試してみたい場合は、有効なブラウザ用の自動クローズスクリプトタグを含む、ライブプレビュー付きの簡単な編集可能なスニペットがあります。

div { display: flex; }
div + div {flex-direction: column; }
<div>Mime type: <label><input type="radio" onchange="t.onkeyup()" id="x" checked  name="mime"> application/xhtml+xml</label>
<label><input type="radio" onchange="t.onkeyup()" name="mime"> text/html</label></div>
<div><textarea id="t" rows="4" 
onkeyup="i.src='data:'+(x.checked?'application/xhtml+xml':'text/html')+','+encodeURIComponent(t.value)"
><?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
[<!ENTITY x "true XHTML">]>
<html xmlns="http://www.w3.org/1999/xhtml">
<body>
  <p>
    <span id="greet" swapto="Hello">Hell, NO :(</span> &x;.
    <script src="data:text/javascript,(g=document.getElementById('greet')).innerText=g.getAttribute('swapto')" />
    Nice to meet you!
    <!-- 
      Previous text node and all further content falls into SCRIPT element content in text/html mode, so is not rendered. Because no end script tag is found, no script runs in text/html
    -->
  </p>
</body>
</html></textarea>

<iframe id="i" height="80"></iframe>

<script>t.onkeyup()</script>
</div>

Textareaの下にHello, true XHTML. Nice to meet you!が表示されるはずです。

対応していないブラウザの場合は、textareaの内容をコピーして.xhtml(または.xht)拡張子の付いたファイルとして保存できます( このヒントをくれたAlekに感謝 )。

2
myf