21.11.05 - TIL


フロント面接トレーニングの準備


HTML


<section>と<article>の違い


sectionは、通常、類似の特性を含むコンテンツに使用されます.
記事には相関性がなく、独立したコンテンツが含まれている場合に使用されます.
たとえば、ニュース記事は記事です.各記事には独立した内容が含まれています.自己紹介は紹介、連絡情報、経歴などの関連内容なのでsectionを使用します.

<script>宣言位置の変化、問題

<head>件が<script>件と発表されたとき
ブラウザがhtmlをパケット化するときにscriptタグに遭遇した場合、パケット化を停止し、jsファイルをダウンロードし、実行後にパケット化を再開します.
質問:大きなファイルの場合、ユーザーはサイトを表示するのに長い時間がかかります.<body>が最後尾で<script>と宣言されたとき
ブラウザはhtmlの処理後にscriptに会い、jsファイルをダウンロードして実行し、headに宣言する際の問題を解消します.つまり、ユーザーはWebサイトをすばやく閲覧することができます.
質問:サイトがjsに依存している場合、すなわち、データを受信する必要がある場合、サイトはすぐに見えますが、意味のあるサイトではありません.ファイルのダウンロードが完了するまで待ってこそ、意味のあるデータサイトが表示されます.<head>件が<script async>件と発表されたとき
ブラウザはhtmlをページングするときにscript asyncを見て、ページングと同時にjsファイルをダウンロードします.ダウンロードが完了するとhtmlパケットが停止し、jsファイルが実行された後にパケットが再開されます.
質問:jsでquerySelectorを使用してhtmlを操作する場合は、まだ目的の要素が定義されていない可能性があります.(これはポスト分割があるため)
もう1つの問題は、複数のjsファイルが存在し、順序に依存している場合、ファイルの実行順序は読み取り順ではなく、ダウンロード順である.b.jsのファイル容量が最小の場合、最初に実行します.
<script async src="a.js" />
<script async src="b.js" />
<script async src="c.js" />
<head>件が<script defer>件と発表されたとき
ブラウザはhtmlを分割するとscript deferが表示され、分割と同時にjsファイルがダウンロードされます.htmlセグメントが完了すると、ダウンロードしたファイルが順次実行され、asyncを宣言する際に発生する問題が解決します.

シンボルラベルの説明


これは、開発者とブラウザに意味のあるタグを提供することを意味します.例えば、<div>タグは非意味タグであり、<table><article><header><main>は意味タグに属する.心理ラベルの利点は、ラベルを見るだけで大まかな内容を推測できることです.

JavaScript


JSON


データシリアル化は、サーバと送受信サーバの間で使用できる最も簡単なファイルフォーマットであり、キーと値からなるJavascriptオブジェクト構文に従う文字ベースのデータフォーマットです.最大の利点は、プログラミング言語でもプラットフォームでも使用できることです.JSON.stringifyを使用してobjectをjsonに変換
関数またはSymbolをjosnXに変換
let json = JSON.stringify(['a','b']);
jsonフォーマットからobjectに変換する場合はJSON.pasreを使用します
let obj = JSON.parse(json);

ETC


DOM


DOMはhtmlまたはxmlドキュメントを表すAPIです.プログラミング言語は、ドキュメントの構造、スタイル、コンテンツなどを変更するのに役立ちます.html要素は構造化されているので、ブラウザがHTMLページを認識する方法を意味します.
HTMLコードはDOMではなく、私が書いたコードがブラウザで分割されるとDOMになります.DOMは木型の資料構造です.
DOMは、htmlドキュメントまたはxmlドキュメントをオブジェクトモデルに変換してプログラミング言語でアクセスし、Webブラウザでレンダリングするインタフェースです.

最後に振り返る


今日は項目表示を行いました.2日前にクローンコードを作成したおかげで、素早く簡単にマークアップできます.でも襟はまだ使えません.週末を利用して襟を握る…!!!