DOM %PDVNFOU )5.- #PEZ %JW 1 5&95 1 5&95 • Document Object Model
• ϒϥβͰͷHTMLͷ෦දݱ
• ͔ͭ JavaScript Ͱૢ࡞Ͱ͖Δσʔλߏ var div = document.body. fi rstChild; var p2 = div.childNodes[1]; p2.appendChild(document.createElement("span")); +BWB4DSJQU &OHJOF CJOEJOHT
• ηϨΫλͷཁૉ໊ͷ \^BCDETQFDJ fi DJUZ
MJ\^BCDETQFDJ fi DJUZ
MJ fi STUMJOF\^BCDETQFDJ fi DJUZ
VMMJ\^BCDETQFDJ fi DJUZ
VMPMMJ\^BCDETQFDJ fi DJUZ
I\^BCDETQFDJ fi DJUZ
VMPMMJSFE\^BCDETQFDJ fi DJUZ
MJSFEMFWFM\^BCDETQFDJ fi DJUZ
YZ\^BCDETQFDJ fi DJUZ
TUZMFBCDETQFDJ fi DJUZ
http://taligarsiel.com/Projects/howbrowserswork1.htm#Speci fi ty
DOMͷߋ৽සΛଟ͘͠ͳ͍ const ul = document.getElementById("foo"); const fr = document.createDocumentFragment(); for (let i =0;i <100000;i++) { let li = document.createElement("li"); i.textContent = `${i}`; // fragment ʹରͯ͠ೖΕ͓ͯ͘ fr.appendChild(li); } ul.appendChild(fr);
> fi FS > < QBSFO > fi FS > fi FS > UPLFOJ[F "45 > fi FS > < QBSFO > fi FS > fi FS > 1SPHSBN 'VODUJPO%FDMBSBUJPO *EFOUJ fi FSTVN QBSBNT *EFOUJ fi FSC *EFOUJ fi FSB
> fi FS > < QBSFO > fi FS > fi FS > UPLFOJ[F "45 > fi FS > < QBSFO > fi FS > fi FS > 1SPHSBN 'VODUJPO%FDMBSBUJPO *EFOUJ fi FSTVN QBSBNT *EFOUJ fi FSC *EFOUJ fi FSB +BWB4DSJQU͜Ε·Ͱͱಉ༷ߏͰද͞ΕΔɻ "CTUSBDU4ZOUBY5SFFͱ͍͏ߏɻ
(Client Certi fi cate) ଓΛཱ֬ͱ͍͏ͷʁ • HTTP ͳΒ͜ΕͰܨ͕Δ͕ɺ࠷ۙͷେମͷWebαʔό HTTPS ͳ ͷͰɺ͜Ε͚ͩͰܨ͕Βͳ͍ɻ҉߸ԽͷͨΊͷΓऔΓ͕ߋʹ ߦΘΕΔɻ(※؆ུԽ͍ͯ͠ΔͨΊɺਖ਼֬Ͱͳ͍) ΑΖ͓͘͠ئ͍͍ͨ͠·͢ɻ(Client Hello) ͪ͜Βͦ͜ΑΖ͓͘͠Ͷ͕͍͠·͢ɻ (Server Hello) Θͨ͜͠͏͍͏ͷͰ͢ɻ (Server Certi fi cate) ͜͏͍͏伴Ͱͤ·͢ (Server Key Exchange) Θͨ͜͠͏͍͏ͷͰ͢ɻ(Client Certi fi cate)
4FSWFS GET /main.css GET /main.js GET /image0.png σʔλͷΓऔΓ GET /index.html 200 OK 200 OK 404 Not Found 304 Not Modi fi ed )551্ͰσʔλͷΓऔΓ͕ߦΘΕɺͦΕ͕ϨϯμϦϯάϓ ϩηε+4Τϯδϯ͕࣮ߦ͞ΕΔϑΣʔζΛܦͯϖʔδ͕ग़Δ
Cache Storage • ϨεϙϯεΛΩϟογϡ͢ΔΈ 4FSWFS GET /main.css GET /main.js GET /image0.png GET /index.html 200 OK 200 OK 404 Not Found 304 Not Modi fi ed Ұճμϯϩʔυͨ͠ϑΝΠϧωοτϫʔΫ͔ΒಡΈࠐΈͨ ͘ͳ͍ɻ࠶ར༻͍ͨ͠ɻ
Cookie Storage id pass 4FSWFS GET / 302 Redirect GET /login 200 OK POST /login id=foo&pass=xxx 302 Redirect Set-Cookie: session=xxx GET / cookie: session=xxx
Cookie Storage id pass 4FSWFS GET / 302 Redirect GET /login 200 OK POST /login id=foo&pass=xxx 302 Redirect Set-Cookie: session=xxx GET / cookie: session=xxx 4FTTJPO$PPLJFΛ࡞Δ·ͰͷྲྀΕ