共有: HTML 面接でよくある質問

HTML の基本

1.1 最初のリクエストから最終的な表示までの Web ページの完全なプロセスを説明してください。

一般的に、次の 7 つのステップに分けることができます。 

1.ブラウザに URL を入力します。 

2. DNS サーバーに送信し、ドメイン名に対応する WEB サーバーの IP アドレスを取得します。 

3. WEB サーバーとの TCP 接続を確立します。 

4. ブラウザは、対応する HTTP 要求を WEB サーバーの IP アドレスに送信します。 

5. WEB サーバーはリクエストに応答し、指定された URL のデータまたはエラー メッセージを返します リダイレクトが設定されている場合は、新しい URL アドレスにリダイレクトされます。 

6. ブラウザはデータをダウンロードした後、HTML ソース ファイルを解析し、解析プロセス中にページの組版を実現し、解析が完了した後に基本ページをブラウザに表示します。 

7. ページ内のハイパーリンクを分析して現在のページに表示し、ハイパーリンクを送信する必要がなくなるまで上記のプロセスを繰り返し、表示を完了します。

 

1.2 DOCTYPE 宣言の役割は何ですか? ストリクト モードとプロミスキャス モードの違いは何ですか? 

HTML 言語はあまりにも長い間存在しており、ドキュメントのいくつかの異なるバージョンが必ず存在します。ドキュメントのバージョン、タイプ、スタイルをブラウザに知らせるには、ドキュメントの先頭にある DOCTYPE ステートメントを使用して、現在のドキュメントのバージョンとスタイルを指定する必要があります。バージョン情報が Web ページで提供されている場合は、ページのコードが現在のバージョンとスタイルに準拠しているかどうかを確認するのに役立ちます。

<! DOCTYPE> ステートメントは、ドキュメントの上部のラベルの前にあり、ドキュメントの解析に使用するドキュメント タイプの仕様をブラウザのパーサーに伝えます。

厳密モード (標準モード) では、ブラウザーは仕様に従ってページをレンダリングします。無差別モードでは、ページは下位互換性のある方法で表示され、古いサイトが機能しないようにします。

HTML ドキュメントに整形式の DOCTYPE が含まれている場合、通常は標準モードでレンダリングされます。HTML 4.01 ドキュメントの場合、厳密な DTD を含む DOCTYPE により、ページが標準モードでレンダリングされることがよくあります。DOCTYPE が存在しないか不正な形式であると、ドキュメントがプロミスキャス モードでレンダリングされます。

1.3 一般的なブラウザ カーネルについて簡単に説明してください。

ブラウザ カーネルは Web ページの構文の解釈を割り当て、Web ページを表示します。これにより、ブラウザが Web ページのコンテンツとページのフォーマット情報を表示する方法が決まります。

一般的なブラウザ カーネル:

トライデント: Internet Explorer

Gecko: Firefox などの Mozilla ブラウザー

Webkit: Chrome ブラウザの中核でもある Safari ブラウザ

まばたき: Chrome ブラウザ、Opera ブラウザ

1.4 html タグのセマンティクスを理解するには?

セマンティクスの主な目的は、マークアップ属性の目的と機能を直感的に理解することです。

それは次のように要約できます: 正しいラベルで正しいことを行います。

Htmlセマンティクスは、ページのコンテンツを構造化し、ブラウザーが解析しやすく、検索エンジンが解析しやすくし、帽子の保守性と再利用性を向上させることができます。

たとえば、セマンティックでないタグはできるだけ使用せず構造的なタグ<header> <section> <footer>を使用します

1.5 アンカーポイントの機能は何ですか? アンカーを作成するには?

アンカー ポイントは、ドキュメント内の特定の場所にリンクするために使用されるブックマークに似た、ドキュメント内の行上のマークです。アンカーが定義されている場合、ユーザーが必要な情報を見つけるためにページをスクロールし続ける必要がないように、そのアンカー (ページ内のセクションなど) に直接ジャンプするリンクを作成できます。

<a>要素を使用してアンカー ポイントを作成する場合、 name属性を使用して名前を付ける必要があります。コードは次のとおりです。

<a name= ” anchorname1 ” >锚点一</a>

次に、リンクを作成してアンカーに直接ジャンプできます。コードは次のとおりです。

<a href=#anchorname1>回到锚点一</a>

1.6 使用<label>元素显示文本与使用其他文本标记显示文本有什么不同?

<label>元素的直观效果是直接显示标记之间的文本,而且不会为文本呈现任何特殊效果。但是,它和其他文本标记所不同的是,它为鼠标用户改进了用户体验性。

这是因为,<label>元素可以附带一个for属性,只要将该属性的值设置为表单中任何一个控件的id属性的值,则当该用户点击标签(文本)时,浏览器就会自动将焦点转到和标签相关的表单控件上。即:如果在<label>元素内点击文本,就会触发此控件。

1.7 列举常用的结构标记,并描述其作用

结构标签专门用于标识页面的不同结构,相对于使用<div>元素而言,可以实现语义化的标签。

常用的结构标签有:

<header>元素:用于定义文档的页眉;

<nav>元素:用于定义页面的导航链接部分;

<section>元素:用于定义文档中的节,表示文档中的一个具体的组成部分;

<article>元素:常用于定义独立于文档的其他部分的内容

<footer>元素:常用于定义某区域的脚注信息;

<aside>元素:常用于定义页面的一些额外组成部分,如广告栏、侧边栏和相关引用信息等。

1.8 超级链接有哪些常见的表现形式?

<a>元素用于创建超级链接,常见的表现形式有:

普通超级链接。语法:<a href=””  target=””>文本</a>

下载链接,即目标文档为下载资源。语法:<a href=day.zip>下载</a>

电子邮件链接,用于链接到Email。语法:<a href=mailo:[email protected]>

联系我们</a>

空链接,用于返回页面顶部。语法:<a href=#>...</a>

链接到JavaScript,以实现特定的代码功能。语法:<a href=javascript:...>...</a>

1.9 简要描述行内元素和块级元素的区别?

块级元素的前后都会自动换行,如图存在换行符一样。默认情况下,块级元素会独占一行。例如<p><hn><div>都是块级元素。显示这些元素中间的文本时,都将从新行中开始显示,其后内容也将在新行中显示。

行内元素可以和企业行内元素位于同一行,在浏览器中显示是不会换行。例如<a><span>等。对于行内元素,不能设置其高度和宽度。

还有一种元素,行内块级元素,比如<img><input>元素等。这些元素可以和其他行内元素位于同一行,同时可以设置其高度和宽度。

1.10 表单向服务器提交数据有几种方式?这些方式有什么区别?

将表单数据发送给服务器的常用方式有两种:GetPost

浏览器发送给服务器的HTTP请求分为请求头(header)和请求主体(body)两部分。其中,必须包含头部分,用于指定发送请求的方式、目的以及其他关键信息;而主体是可选的。在头数据和主体数据之间用一个空白行来隔开。

比如,需要发送请求到页面getstockprice.php,而且需要附带数据Symbol=MSFT。那么如果使用Get方式发送数据,简化后的请求数据内容如下所示:

GET/Trading/GetStockPrice.aspx?Symbol=MSFT HTTP/1.1

Host:localhost

如果使用Post方式发送数据,则简化后的请求数据内容如下所示:

GET/Trading/GetStockPrice.aspx HTTP/1.1

Host:localhost

Content=Type:application/x-www-form-urlencoded  表示请求的MIME类型

Content-Length:11  表示请求数据的长度(大小)

Symbol=MSFT

由此可见,两种方式的区别主要在于发送数据方式不同。

使用Get方式向服务器发送表单数据时,表单数据附加在URL属性的末端;才有POST方法发送数据时,数据都会放在在主体中发送。

おすすめ

転載: blog.csdn.net/u013910042/article/details/50381954