フロントエンド開発スクール採用面接の質問整理【2】 - HTML
前に書かれている：
インタビューの質問はすべて整理され、GitHub で共有されています。スターへようこそ。
アドレス: https://github.com/shadowings-zy/front-end-school-recruitment-question
1.HTML要素(要素)
Q: よく使用される HTML 要素を簡単に紹介しますか?
ブロックラベル: 要素は 1 行を占め、幅と高さを指定できます。
一般的に使用されるブロック要素は次のとおりです。
<div>、<p>、<h1>-<h6>、<ol>、<ul>、<dl>、<table>、<form>
インライン要素: 要素は 1 行にあり、幅と高さはコンテンツによって決まり、コンテンツが HTML の幅を超える場合にのみ改行されます。
一般的に使用されるインライン要素は次のとおりです。
<a>、<span>、<i>、<em>、<strong>、<label>
インラインブロック要素は、インライン要素とブロック要素の性質を併せ持ち、他の要素と並んでいますが、要素の高さ、幅、行の高さ、上下の余白を設定できます。一般的に使用されるインライン ブロック要素は次のとおりです。
<img>、<input>
Q: 意味要素とは何ですか?
セマンティック要素は、それ自体がコンテンツ タイプに関する情報を伝達する要素です。これらの要素により、ページのコンテンツが構造化され、構造がより明確になり、SEO が容易になり、読みやすく、保守しやすくなります。
共通の意味要素:
<header>
<footer>
<nav>
<article>
<section>
<aside>
<h1>
<h2>
<h3>
<h4>
<h5>
<h6>
<strong>
<em>
Q: HTML5 ではどのような要素が追加されますか?
| ラベル | 説明する |
|---|---|
<header> |
セクションまたはドキュメントのヘッダーを定義します。 |
<footer> |
セクションまたはドキュメントのフッターを定義します。 |
<nav> |
ナビゲーション リンクを定義するセクション。 |
<article> |
記事の内容を定義します。 |
<section> |
文書内の段落を定義します。章、ヘッダー、フッター、文書のその他の部分など。 |
<aside> |
記事以外のコンテンツを定義します。余談の内容は記事の内容と関連している必要があります。 |
<audio> |
サウンドを定義します。 |
<canvas> |
グラフを定義します。 |
<video> |
ムービークリップや他のビデオストリームなどのビデオを定義します。 |
<source> |
<video>や などのメディア要素の<audio>メディア リソースを定義します。 |
2. HTMLイベント
Q: HTML のイベント モデルについて説明してください。イベントキャプチャ/イベントバブリングとは何を意味しますか?
ページがイベントをトリガーすると、ブラウザは主に 3 つのステージ、つまり
1. イベントのキャプチャ ステージ
2. ターゲットの処理ステージ
3. 後続のイベント処理ステージを実行します。
イベントがトリガーされると、イベント オブジェクトをルート ノードからターゲット ノードに渡すプロセスがイベント キャプチャです。
イベントが処理された後、それをターゲット ノードからルート ノードに逆方向に渡すプロセスがイベント バブリングです。
Q: イベントのバブリングを防ぐにはどうすればよいですか? 要素のデフォルト動作を防ぐにはどうすればよいですか?
event.stopPropagation() // 阻止事件冒泡
event.preventDefault() // 阻止元素默认行为