web-dev-qa-db-ja.com

ネストされたアンカータグが違法なのはなぜですか?

アンカータグのネストは標準に準拠したHTMLではないことを学びました。

W3から:

A要素によって定義されたリンクとアンカーは、ネストしてはいけません。 A要素には、他のA要素を含めることはできません。

DTDではLINK要素が空であると定義されているため、LINK要素もネストできません。

この質問 で選択した回答で提案されているような代替案は、単にアンカーをネストするよりも予期しない動作を引き起こす可能性が高いように思われます!

また、JSでページをリダイレクトするためだけにonclickイベントハンドラを作成するのはやり過ぎのようです。言うまでもなく、スクリプトソリューションを使用すると、ユーザーがスクリプトを無効にして閲覧する際に問題が発生します。

[〜#〜] edit [〜#〜]

おもしろいのは、デモンストレーションするために fiddle に取り組んでいたことと、chromeが実際にDOMを再構築するということを見落としていたことです。

<div id="container">

    <a href="http://yahoo.com"></a>
    <div class="parent">
        <a href="http://yahoo.com">Parent Element</a>
        <a href="http://google.com">
            <div class="child">Child Element</div>
        </a>
        <a href="http://bing.com">
            <div class="child">Other Child</div>
        </a>
    </div>

</div>

ホバーが機能し、マウスをテキスト上に置いたので、これを見落としていました。今これを知ることは必ずしも私の質問を変えるわけではありませんが、それは確かにそれが私が思った方法でさえ機能しないことを示しています。

32
Doug Morrow

アンカーは単なるリンクではなく、リンクできるものでもあることに留意してください。 (前者の使用はfar後者よりも一般的です。)引用 W3C (古いが、関連する):

アンカーは、ハイパーテキストリンクの開始または終了をマークするテキストです。

そのためには、アンカーをリンクと考えないでください。これは、ドキュメント内の別のポイント(および/または別のポイント)に接続するポイントと考えてください(同じドキュメントまたは別のドキュメントでは、違いはありません)。非物理的スレッドによって接続された、非物理的空間内の2つのポイント。

そのため、アンカーには多くのコンテンツを含めるべきではありません。多くのコンテンツが含まれている場合、「ポイント」になるのをやめ、「エリア」になり始めます。たとえば、ブラウザが一度に表示できる以上のスペースをレンダリング時に占有するアンカーを想像してください。そのアンカーに何かリンクしている場合、どこに行くべきですか?始まり?中間?終わり? (直観的には最初のことを考えているかもしれませんが、アイデアは得られます。)

さらに、アンカーには間違いなく他のアンカーを含めるべきではありません。非物理的なポイント間の非物理的な接続はあいまいになる可能性があります。子アンカーは他のポイントに接続していますか、または親アンカーは他のポイントに接続していますか?このおそらくは、vast今日のアンカーの大半は、アンカーから別のドキュメントへの一方向リンクです。しかし、アンカーの目的は別のドキュメントへの一方向のリンク以上のものであるため、定義は引き続きその目的を具体化します。

35
David

<a>の仕様 のコンテンツモデルは次のとおりです。

透過的ですが、 インタラクティブコンテンツ 子孫が存在してはなりません。

したがって、仕様は実際にあなたが言うよりも複雑です。これは<button>にも当てはまります。基本的に、リンク内に機能するリンクやボタン内にボタンを配置することはできません。

残念ながら、あなたの質問に対する強力な答えはありませんwhy-推測することしかできません。明確な理由の1つは、それが引き起こすあいまいさです(たとえば、内側のアンカーをクリックしたときにどのアンカーに従うべきですか?)

これにより、機能的なあいまいさだけでなく、意味的なあいまいさも生じます。 <a>のコンテンツは、そのハイパーリンクのラベルです。これは、内側のハイパーリンクが外側のリンクのコンテンツのラベルの一部であることを意味しますか?

7
Explosion Pills

アンカーのネストは、あいまいさのために、標準では推奨されていません(私がテストしたすべてのブラウザーは、最も内側のクリックターゲットにつながるようです)。

大きな部分が特定のページにつながり、この部分では小さなセクションが別の場所につながると言うのは論理的ではありません。この種の振る舞いのユースケースはまだ見なければなりません。利用可能なスクリプト言語の進化により、この種の反復または遺産は機能しますが(例:divのjavascriptクリックイベント)、コードが特定のURLにリダイレクトしてから別のURL(親アンカーのhref)にリダイレクトすることはありません。

編集:あなたが参照した質問を見ると、まったく同じhrefを指す2つのアンカーを積み重ねてもまったく役に立ちません。ネストされたものを削除するだけで、すべてがうまくいきます。 a a{color:red;}のようなCSSルールを実行したためである場合は、スパンを使用してください!または、display:inlineのdivでも、アンカーはどこかに行くべきであり、スタイリングの目的などに使用するべきではありません。

1
Salketer