src 属性と href 属性の目的と機能の違いは何ですか?

src 属性と href 属性は HTML で一般的に使用される属性であり、外部リソースへのパスまたはリンクを指定するために使用されます。これら 2 つのプロパティは外観的には似ていますが、機能的には明らかな違いがあります。

まず、src 属性 (source の略) は、外部リソースのパスを指定するために使用されます。通常、外部スクリプト、画像、またはオーディオおよびビデオ ファイルを HTML ドキュメントに埋め込むために使用されます。 src 属性の値は、相対パスまたは絶対パスにすることができます。

画像を例に挙げます。HTML ページに画像を挿入する場合は、次のコード例を使用できます:

<img src="example.jpg" alt="Example Image">

この例では、src 属性の値は次のとおりです。 "example.jpg" : 挿入する画像のパスを指定します。ブラウザはパスに従って対応する画像をロードし、HTML ページに表示します。

主に参照文書間のリンク関係を指定するために使用される href 属性 (ハイパーテキスト参照の略) を見てみましょう。 href 属性は、HTML アンカー リンク、ナビゲーション リンク、スタイル シート リンクなどでよく使用されます。

アンカー リンクを例として、次のコード例を使用できます。

<a href="#section1">Go to Section 1</a>

...

<h2 id="section1">Section 1</h2>

この例では、href 属性の値は "#section1" であり、ターゲットがリンクのidは「section1」の要素です。ユーザーがリンクをクリックすると、ブラウザは適切な場所までスクロールし、ターゲット要素が表示されます。

アンカー リンクに加えて、href 属性は、他の Web ページへのジャンプなどのナビゲーション リンクにも使用できます:

<a href="https://example.com">Go to Example Site</a>

この例では、href 属性の値は " https://example.com」。リンクがジャンプする Web ページを指定します。

src 属性と href 属性では目的と機能が異なることに注意してください。 src 属性は外部リソースを HTML ドキュメントに埋め込むために使用され、href 属性はリンク関係を指定するために使用されます。実際のアプリケーションでは、これら 2 つの属性を必要に応じて正しく使用すると、Web ページのパフォーマンスと機能を向上させることができます。

最後に、src 属性と href 属性を使用する場合は、パスまたはリンクの値を正しく入力する必要があります。相対パスは現在のドキュメントのパスを基準にして解決されますが、絶対パスはルート ディレクトリから始まるフル パスです。したがって、コードを記述するときはパスの正確さに注意して、外部リソースを正しくロードまたはリンクできるようにしてください。

以上がsrc 属性と href 属性の目的と機能の違いは何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。