検索
ホームページウェブフロントエンドjsチュートリアルフロントエンドのインタビューの質問の URL、href、src を収集する

この記事では、私が毎日収集しているフロントエンドのインタビューの質問に関する文法規則と基本的な概念を共有します。非常に優れており、必要な友人は参照できます

1. URL の概念

Uniform Resource Locator (または、Uniform Resource Locator/場所アドレス、URL アドレスなど、英語:Uniform Resource Locator、URL と略されることが多い)、一般的に Web ページ アドレスとしても知られる(ウェブアドレス)。インターネット上の番地と同じように、インターネット上の標準リソースの住所です。

2. URL形式

2.1 標準形式

プロトコルタイプ: [//サーバーアドレス[:ポート番号]][/リソースレベルUNIXファイルパス] クエリ

2.2 ファイル名?形式

プロトコルタイプ: [//[リソースへのアクセスに必要な認証情報@]サーバーアドレス[:ポート番号]][/リソースレベルUNIXファイルパス]ファイル名? Query
where [アクセス認証情報@;:ポート No .;?クエリ;#フラグメントID]はすべてオプションです。

3. URL の文法規則

たとえば、URL http://segmentfault.com/html/index.asp は次の文法規則に準拠する必要があります:

scheme: //host.domain: port/path /filename

3.1 説明

(1) スキーム - インターネット サービスの種類を定義します。最も一般的なタイプは http です

(2) ホスト - ドメイン ホストを定義します (http のデフォルトのホストは www)

(3) ドメイン - w3school.com.cn などのインターネット ドメイン名を定義します

(4) ): port - 定義 ホスト上のポート番号 (http のデフォルトのポート番号は 80)

(5) path - サーバー上のパスを定義します (省略した場合、ドキュメントは Web サイトのルート ディレクトリに配置する必要があります) 。

(6) filename - ドキュメント/リソースの名前を定義します

3.2 URL スキーム

最も人気のあるスキームのいくつかを次に示します:

Scheme Access for...
http ハイパーテキスト転送プロトコル http:// で始まる通常の Web ページ。暗号化はありません。
https HTTP 安全な 安全なウェブページ。交換されるすべての情報を暗号化します。
ftp ファイル転送プロトコル は、Web サイトにファイルをダウンロードまたはアップロードするために使用されます。
ファイル コンピュータ上のファイル。

IV. URL の種類

4.1 絶対 URL

絶対 URL (絶対 URL) は、絶対 URL 自体の場所は場所とは関係がありません。参照されている実際のファイルの。

4.2 相対 URL

相対 URL (相対 URL) は、URL 自体を含むフォルダーの場所を参照点として使用して、対象フォルダーの場所を記述します。

一般に、同じサーバー上のファイルには常に相対 URL を使用する必要があります。各ファイルの相対位置が同じである限り、入力が簡単で、ページをローカル システムからサーバーに移動するときに便利です。リンクは引き続き有効です。

以下は、パスとその意味を確立するために使用されるいくつかの特別な記号です。

(1) .: 現在のディレクトリ、相対パスを表します。 例: Text または フロントエンドのインタビューの質問の URL、href、src を収集する

(2) ..: 上位ディレクトリ、相対パスを表します。 例: text または フロントエンドのインタビューの質問の URL、href、src を収集する

(3) ../../: 上位ディレクトリ Directory の上位レベルを表します。相対パス。 例: フロントエンドのインタビューの質問の URL、href、src を収集する

(4) /: ルート ディレクトリ、絶対パスを表します。 例: [text] (/abc) または フロントエンドのインタビューの質問の URL、href、src を収集する

5. href

5.1 仕様の説明

href の概念は、次のように指定します。これにより、現在の要素または現在のドキュメントと、現在の属性で定義された必要なアンカーまたはリソースとの間のリンクまたは関係が定義されます。

5.2 一般的な理解

href 目的はリソースを参照することではなく、現在のタグをターゲットアドレスにリンクできるように接続を確立することです。

6. src の概念

source (略称) は外部リソースの場所を指し、指す内容はドキュメント内の現在のタグの場所に適用されます。

7. href と src の違い

7.1 要求されるリソースのさまざまなタイプ

(1) href は、現在の要素 (アンカー) または現在の要素の間に確立されたネットワーク リソースの場所を指します。文書(リンク)連絡先。

(2) src リソースをリクエストすると、それが指すリソースがダウンロードされ、JavaScript スクリプト、img 画像などのドキュメントに適用されます

7.2 結果は異なります

(1) href が使用されます。現在のドキュメントを追加し、参照リソース間の接続を確立します。

(2) 現在のコンテンツを置き換えるために src が使用されます。

7.3 ブラウザの解析方法が異なります

(1) ドキュメントに追加された場合、ブラウザははドキュメントを CSS ファイルとして認識し、リソースは現在のドキュメントの処理を停止することなく並行してダウンロードされます。このため、@import メソッドを使用する代わりに、link メソッドを使用して CSS を読み込むことが推奨されます。

(2) ブラウザーは、 を解析するとき、リソースがロードされ、コンパイルされ、実行されるまで、他のリソースのダウンロードと処理を一時停止します。これは、ピクチャとフレームにも当てはまります。これは、指定されたリソースを に適用するのと似ています。現在の内容。このため、js スクリプトを先頭ではなく下部に配置することが推奨されます。

8. link と @import の違い

どちらも CSS を外部参照する方法ですが、いくつかの違いがあります:

(1) link は CSS をロードできることに加えて、XHTML タグです。 、RSS などを定義することもできますが、@import は CSS カテゴリに属し、CSS を読み込むことしかできません。

(2) リンクが CSS を参照する場合、ページのロードと同時にロードされます。@import では、ロードする前にページが完全にロードされる必要があります。

(3) リンクは XHTML タグであり、互換性の問題はありません。@import は CSS2.1 で提案されており、以前のバージョンのブラウザではサポートされていません。

(4) リンクは、JavaScript を使用して DOM を制御してスタイルを変更することをサポートしていますが、@import はサポートしていません。

上記は私があなたのためにまとめたものです。

関連記事:

AjaxがRestfulインターフェースを呼び出してJson形式のデータを送信する方法(コード付き)

Boaサーバー下でのAjaxとCGI通信(グラフィックチュートリアル)

Ajax+Struts2実装検証コード 検証関数(グラフィックチュートリアル)

以上がフロントエンドのインタビューの質問の URL、href、src を収集するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
Python vs. JavaScript:開発者の比較分析Python vs. JavaScript:開発者の比較分析May 09, 2025 am 12:22 AM

PythonとJavaScriptの主な違いは、タイプシステムとアプリケーションシナリオです。 1。Pythonは、科学的コンピューティングとデータ分析に適した動的タイプを使用します。 2。JavaScriptは弱いタイプを採用し、フロントエンドとフルスタックの開発で広く使用されています。この2つは、非同期プログラミングとパフォーマンスの最適化に独自の利点があり、選択する際にプロジェクトの要件に従って決定する必要があります。

Python vs. JavaScript:ジョブに適したツールを選択するPython vs. JavaScript:ジョブに適したツールを選択するMay 08, 2025 am 12:10 AM

PythonまたはJavaScriptを選択するかどうかは、プロジェクトの種類によって異なります。1)データサイエンスおよび自動化タスクのPythonを選択します。 2)フロントエンドとフルスタック開発のためにJavaScriptを選択します。 Pythonは、データ処理と自動化における強力なライブラリに好まれていますが、JavaScriptはWebインタラクションとフルスタック開発の利点に不可欠です。

PythonとJavaScript:それぞれの強みを理解するPythonとJavaScript:それぞれの強みを理解するMay 06, 2025 am 12:15 AM

PythonとJavaScriptにはそれぞれ独自の利点があり、選択はプロジェクトのニーズと個人的な好みに依存します。 1. Pythonは、データサイエンスやバックエンド開発に適した簡潔な構文を備えた学習が簡単ですが、実行速度が遅くなっています。 2。JavaScriptはフロントエンド開発のいたるところにあり、強力な非同期プログラミング機能を備えています。 node.jsはフルスタックの開発に適していますが、構文は複雑でエラーが発生しやすい場合があります。

JavaScriptのコア:CまたはCの上に構築されていますか?JavaScriptのコア:CまたはCの上に構築されていますか?May 05, 2025 am 12:07 AM

javascriptisnotbuiltoncorc;それは、解釈されていることを解釈しました。

JavaScriptアプリケーション:フロントエンドからバックエンドまでJavaScriptアプリケーション:フロントエンドからバックエンドまでMay 04, 2025 am 12:12 AM

JavaScriptは、フロントエンドおよびバックエンド開発に使用できます。フロントエンドは、DOM操作を介してユーザーエクスペリエンスを強化し、バックエンドはnode.jsを介してサーバータスクを処理することを処理します。 1.フロントエンドの例:Webページテキストのコンテンツを変更します。 2。バックエンドの例:node.jsサーバーを作成します。

Python vs. Javascript:どの言語を学ぶべきですか?Python vs. Javascript:どの言語を学ぶべきですか?May 03, 2025 am 12:10 AM

PythonまたはJavaScriptの選択は、キャリア開発、学習曲線、エコシステムに基づいている必要があります。1)キャリア開発:Pythonはデータサイエンスとバックエンド開発に適していますが、JavaScriptはフロントエンドおよびフルスタック開発に適しています。 2)学習曲線:Python構文は簡潔で初心者に適しています。 JavaScriptの構文は柔軟です。 3)エコシステム:Pythonには豊富な科学コンピューティングライブラリがあり、JavaScriptには強力なフロントエンドフレームワークがあります。

JavaScriptフレームワーク:最新のWeb開発のパワーJavaScriptフレームワーク:最新のWeb開発のパワーMay 02, 2025 am 12:04 AM

JavaScriptフレームワークのパワーは、開発を簡素化し、ユーザーエクスペリエンスとアプリケーションのパフォーマンスを向上させることにあります。フレームワークを選択するときは、次のことを検討してください。1。プロジェクトのサイズと複雑さ、2。チームエクスペリエンス、3。エコシステムとコミュニティサポート。

JavaScript、C、およびブラウザの関係JavaScript、C、およびブラウザの関係May 01, 2025 am 12:06 AM

はじめに私はあなたがそれを奇妙に思うかもしれないことを知っています、JavaScript、C、およびブラウザは正確に何をしなければなりませんか?彼らは無関係であるように見えますが、実際、彼らは現代のウェブ開発において非常に重要な役割を果たしています。今日は、これら3つの間の密接なつながりについて説明します。この記事を通して、JavaScriptがブラウザでどのように実行されるか、ブラウザエンジンでのCの役割、およびそれらが協力してWebページのレンダリングと相互作用を駆動する方法を学びます。私たちは皆、JavaScriptとブラウザの関係を知っています。 JavaScriptは、フロントエンド開発のコア言語です。ブラウザで直接実行され、Webページが鮮明で興味深いものになります。なぜJavascrを疑問に思ったことがありますか

See all articles

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

Video Face Swap

Video Face Swap

完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

ホットツール

SublimeText3 Linux 新バージョン

SublimeText3 Linux 新バージョン

SublimeText3 Linux 最新バージョン

Dreamweaver Mac版

Dreamweaver Mac版

ビジュアル Web 開発ツール

EditPlus 中国語クラック版

EditPlus 中国語クラック版

サイズが小さく、構文の強調表示、コード プロンプト機能はサポートされていません

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

強力な PHP 統合開発環境

MantisBT

MantisBT

Mantis は、製品の欠陥追跡を支援するために設計された、導入が簡単な Web ベースの欠陥追跡ツールです。 PHP、MySQL、Web サーバーが必要です。デモおよびホスティング サービスをチェックしてください。