0.上部を編集し、終了後に背面に配置します

1. doctypeの役割は何ですか？

DOCTYPE（document type）は、マークアップ言語での文書型宣言の省略形であり、現在書き込まれているHTMLのバージョンをブラウザーに通知します。

HTML4.01とHTML5のDOCTYPEの違い

文档类型定义Document Type DefinitionHTML 4.01はSGML（标准通用标记语言国际上定义电子文档和内容描述的标准）に基づいているため、HTML 4.01のDoctypeはDTD（）を引用する必要があります。
HTML 5はSGMLに基づいていないため、DTDを引用する必要はありませんが、ブラウザーの動作を標準化するにはdoctypeが必要です（html 5は、ブラウザーに統一された標準を使用するように指示することを目的としたこのステートメントを簡略化します）。

宣言メソッドの2つのバージョン

HTML 5：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
</body>
</html>

HTML 4

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

2. HTML、XHTML、およびXMLの違いは何ですか

HTML：ハイパーテキストマークアップ言語/ハイパーテキストマークアップ言語
XML：Extensible Markup Language / Extensible Markup Language
XHTML：拡張可能なハイパーテキストマークアップ言語/拡張可能なハイパーテキストマークアップ言語

XMLは、データを送信および保存するように設計されています。

HTMLは、データを表示するように設計されています。

HTML

HTMLは、Webページのコンテンツを記述および定義するために使用されるマークアップ言語であり、Webページを構成する最も基本的なものです。

いわゆるハイパーテキストとは、テキストにマークを付けるだけでなく、画像、リンク、オーディオ、ビデオなどの他のコンテンツにもマークを付けることができることを意味します。

XML

XMLはそれ自体でタグを「発明」することができます-これは「拡張可能」の意味でもあります。

XMLは特別なことではありません。プレーンテキストです。プレーンテキストを処理できるソフトウェアであれば、XMLを処理できます。

XHTML

HTMLとXMLの組み合わせにより、XHTMLが生成されます。これは、より厳密で純粋なHTMLバージョンです。

継承に関しては、HTMLはStandard General Markup Language（SGML）と非常に柔軟なマークアップ言語に基づくアプリケーションですが、XHTMLはSGMLのサブセットであるExtensible Markup Language（XML）に基づいています。

3.データ属性とは何ですか？

HTML5では、データ-*（自定义数据属性）をプレフィックスとして使用して、一部のデータにアクセスするために必要なカスタム属性を設定できます。

使い方？

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div id="div1" class="div1" data-id="myId" data-id-and-class="Hello">test2</div>
    <div id="div2" myName="Hello">test</div>
    <script>
        var div1 = document.getElementById("div1");
        //获取自定义的值
        var myId = div1.getAttribute("data-id");
        var my = div1.getAttribute("data-id-and-class");
        console.log(myId); // myId
        console.log(my); // Hello
        
        //设置自定义的值
        div1.setAttribute("data-name", "nicai")

        var div = document.getElementById("div2");
        var myName = div.getAttribute("myName");
        console.log(myName); //Hello
        </script>
</body>
</html>

getAttributeこのメソッドは最新のすべてのブラウザで機能しますが、HTML5カスタムデータの目的ではありません-*属性が使用されています。このメソッドは、以前に使用したカスタム属性も使用します。

4. HTMLセマンティクスを理解していますか？

Webセマンティックの詳細で単純な言語理解_フロントエンドラウンド-CSDNblog_webセマンティック理解https://blog.csdn.net/weixin_45844049/article/details/109508985

5. HTML5とは何ですか？HTML5とHTMLの違いは何ですか？

HTML5とは

HTML5はいHTML、新しい標準です。その主な目標はFlash、Silverlightなどの追加のプラグインなしですべてのコンテンツを送信することです。アニメーション、ビデオ、豊富なグラフィカルユーザーインターフェイスなどが含まれます。

違い

文書宣言タイプの観点から：

HTMLこれは長いコードであり、覚えるのが難しいです。次のコード：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

HTML5しかし、覚えやすい簡単なステートメントしかありません。次のように：

<!DOCTYPE html>

意味構造の観点から：

HTML4.0：構造のセマンティクスを反映するタグはありません。通常<div id="header"></div>、Webサイトのヘッドを表すためにこのように名前が付けられています。
HTML5：セマンティクスに大きな利点があります。このようないくつかの新しいタグ提供<header>などを：<article>、<footer>、。

文法処理の観点から：

HTMLは不正確な文法を処理できません。HTML5は不正確な文法を処理できます。

6.一般的に使用されるメタタグは何ですか？

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
</body>

</html>

<meta>：ドキュメントレベルのメタデータ要素

meta 要素によって定義されるメタデータのタイプには、次のものがあります。

name属性が設定されている場合、meta要素はページ全体に適用されるドキュメントレベルのメタデータを提供します。
http-equiv属性が設定されている場合、メタ要素はコンパイル命令であり、提供される情報は同様の名前のHTTPヘッダーと同じです。
charset属性が設定されている場合、メタ要素は、使用する文字エンコードをドキュメントに指示する文字セット宣言です。
itemprop属性が設定されている場合、meta要素はユーザー定義のメタデータを提供します。

7. srcとhrefの違いは何ですか？

srcとは

srcはsourceの略語で、外部ファイルの参照を表し、外部リソースの場所を表し、参照されたファイルをhtmlページの指定された場所にロードします。

src属性は、ページコンテンツの不可欠な部分であり、jsスクリプト、img画像、フレームなどの要素で一般的に使用されます。例えば：

<script src="script.js">
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js">

<img src="2.png" />
<img src="https://apps.bdimg.com/img/2.png" />

hrefとは

hrefはHypertextReferenceの略語で、ネットワークリソースの場所を表すハイパーテキスト参照を意味し、ページとの直接の関係はリンクの関係です。

<link href="reset.css" rel=”stylesheet“/>
<a href="https://www.php.cn/">

違い

Srcは、外部リソースの場所を指します。ポイントされたコンテンツは、ドキュメント内の現在のタグの場所に埋め込まれます。srcリソースが要求されると、ポイントされたリソースがダウンロードされ、jsスクリプトなどのドキュメントに適用されます。 imgの写真とフレーム。ブラウザが要素を解析すると、リソースが読み込まれ、コンパイルされ、実行されることを認識して、他のリソースのダウンロードと処理が一時停止されるため、一般的なjsスクリプトは先頭ではなく下部に配置されます。
hrefは、現在の要素またはドキュメントとの接続を確立するために使用されるネットワークリソースの場所（ハイパーリンク）を指します。ブラウザが他のユーザーが指すファイルを認識すると、現在のドキュメントを停止することなく、リソースを並行してダウンロードします。。治療。

フロントエンドインタビューの概要-HTML