src 属性と href 属性とは何ですか?それらの違いは何ですか?-htmlチュートリアル-php.cn

src 属性と href 属性とは何ですか?それらの違いは何ですか?

王林

リリース： 2023-12-28 15:18:49

オリジナル

1177 人が閲覧しました

src 属性と href 属性とは何ですか?それらの違いは何ですか?

HTML では、src 属性と href 属性は、外部リソースを参照するためによく使用される 2 つの属性です。これらは機能的には似ていますが、使用方法と参照されるリソースの種類にいくつかの違いがあります。

まず、src 属性を見てみましょう。 srcはsourceの略で、主に外部リソースの埋め込み・参照先のアドレスを指定するために使用されます。 <script>、<img alt="src 属性と href 属性とは何ですか?それらの違いは何ですか?" >、<iframe> などのタグに適用できます。 src 属性を使用すると、外部スクリプトファイル、画像ファイル、または埋め込み Web ページを現在の HTML ページにロードできます。 </script>

たとえば、次のコードは、src 属性を使用して外部 JavaScript ファイルを参照する方法を示しています。

<!DOCTYPE html>
<html>
<head>
    <script src="script.js"></script>
</head>
<body>
    <!-- 页面内容 -->
</body>
</html>

ログイン後にコピー

この例では、script タグの src 属性は、外部 JavaScript ファイルのアドレスを指定します。 JavaScript ファイルを「script.js」として保存し、ブラウザがこのページを解析するときに、指定されたパスからこの外部スクリプトファイルをロードして実行します。

次はhref属性ですが、hrefはハイパーテキストリファレンスの略で、主にハイパーリンク要素の対象リソースアドレスを指定するために使用されます。主に、、 src 属性と href 属性とは何ですか?それらの違いは何ですか? などのタグに使用されます。 href 属性を使用すると、現在の HTML ページ内の他のページ、スタイルファイル、または画像ファイルへのハイパーリンクを作成できます。

次は、href 属性を使用してハイパーリンクを作成する例です。

<!DOCTYPE html>
<html>
<head>
</head>
<body>
    <a href="https://www.example.com">点击这里访问示例网站</a>
</body>
</html>

ログイン後にコピー

この例では、タグの href 属性は、ターゲットリンクのアドレスを「」として指定します。 https://www.example.com」。ユーザーがこのリンクをクリックすると、ブラウザは指定されたアドレスにターゲットページをロードして表示します。

一般に、src 属性は主に埋め込みファイルまたは外部ファイルを参照し、その内容を現在のページに表示するために使用され、href 属性は主にハイパーリンクの作成、他のページへのジャンプ、または外部リソースの読み込みに使用されます。

さらに、src 属性は通常、リソースを埋め込むために使用されるため、ファイルへのパスを指定する必要があり、リソースのロード後にファイルを表示または実行する必要がありますが、href 属性は次の目的で使用されます。リンクを作成する場合、ターゲットリソースは通常、独立したページファイルであるため、完全な URL アドレスを指定する必要があります。

要約すると、src 属性と href 属性の間には、リソースを参照する方法と目的においていくつかの違いがあります。これらを正しく理解して使用すると、HTML ページと外部リソース間の相互作用や参照をより深く理解できるようになります。

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