THE HAM MEDIA BLOG

‚S‰ñ‚É‚à•ª‚¯‚Ä‚µ‚Ü‚Á‚½‚Ì‚Å‚·‚ªACSS‚ðDOM“ǂݍž‚Ý‘O‚ÉJavaScript‚œǂݍž‚Þ‚ ‚ꂱ‚ê‚ð‚²Ð‰î‚µ‚Ä‚«‚Ü‚µ‚½BÅŒã‚́A‚È‚­‚Ä‚à—Ç‚©‚Á‚½‚Ì‚Å‚·‚ªAŠO•”‰»‚µ‚½CSS‚ðjQuery‚ŒljÁ‚·‚é•û–@‚ðÐ‰î‚µ‚Ä‚±‚̃VƒŠ[ƒY‚͏I—¹‚É‚µ‚½‚¢‚ÆŽv‚¢‚Ü‚·B

DOM‘€ì‚ÅŠÖ‚í‚éCSS‚ŁA‚»‚ê‚ðJavaScript‚ªŽg‚¦‚éŠÂ‹«Žž‚݂̂ɓǂݍž‚Ü‚¹‚āAŠŽ‚ADOM“ǂݍž‚ÝŠ®—¹‘O‚ÉŽÀs‚µ‚Ä‚¨‚­‚Æ‚¢‚¤•û–@‚ð‚±‚±‚܂ŏЉ‚Ä‚«‚Ü‚µ‚½B

jQuery‚Åhead“à‚ÉŠO•”CSS’ljÁ

¡‰ñ‚̃R[ƒh‚́AÅ‰‚ÉjQuery‚ÅCSS‚ð’ljÁ‚·‚é•û–@‚ðÐ‰î‚µ‚½‚Ì‚Æ‚Ù‚Æ‚ñ‚Ç“¯‚¶‚Å‚·Bˆá‚¤“_‚Ístyle‚Å‚Í‚È‚­Alinkƒ^ƒO‚Å‚ ‚é‚Æ‚¢‚¤‚±‚ƂƁA‚»‚Ì‚Q“¯—lACSS‚Í•Ê“rŠO•”‰»‚µ‚Ä‚¨‚­‚­‚ç‚¢‚Å‚·B

¡Script

$('<link />',{
    rel:'stylesheet',
    type:'text/css',
    href:'https://h2ham.up.seesaa.net/css/20100301.css'
}).appendTo('head');

‚Æ‚Á‚Ä‚àƒVƒ“ƒvƒ‹BÅŒã‚É.appendTo()ƒƒ\ƒbƒh‚Åhead“à‚ɒljÁ‚µ‚Ä‚¨‚©‚È‚¢‚Æ“K—p‚³‚ê‚Ü‚¹‚ñB–Y‚ꂸ‚ɁB‚à‚¿‚ë‚ñhead“à‚Å‚È‚­‚Ä‚àAbody‚Å‚à‘åä•v‚Å‚·‚ªA“Á‚É——R‚ª‚È‚¢‚Ì‚Å‚ ‚ê‚΁Ahead“à‚É‚µ‚½•û‚ª–³“ï‚Å‚·B

¡CSS

.text div#test01{
    background-color:#202020;
}

.text div#test01 p{
    padding-left:10px;
    color:#ffffff;
    font-weight:bold;
    background-color:#333333;
}

‘O‰ñ‚Ü‚Å‚Ì‚Æ“¯—l‚ÌCSS‚ŁAŠO•”‰»‚³‚ê‚Ä‚¢‚Ü‚·B

¡ƒfƒ‚

‘O‰ñ‚Ü‚Å“¯—lACSS‚ª‚¤‚Ü‚­“K—p‚³‚ê‚Ä‚¢‚é‚ƁA•”wŒi‚É”’•¶Žš‚É‚È‚Á‚Ä‚¢‚Ü‚·B“K—p‚³‚ê‚Ä‚¢‚È‚¢ê‡‚́A”’’n‚ɍ••¶Žš‚Å‚·B

×‚©‚­•ª‚¯‚Ä‚µ‚Ü‚Á‚½‚Ì‚Å‚·‚ªAÐ‰î‚͈ȏã‚Å‚·BjQuery‚ð—˜—p‚µ‚Ä‚¢‚é‚Ì‚Å‚ ‚ê‚΁A¡‰ñ‚Ì•û–@‚ªˆê”ÔƒVƒ“ƒvƒ‹‚¾‚ÆŽv‚¢‚Ü‚·B“®ìŒy‚­‚µ‚½‚¢‚È‚Ç‚Ì‚±‚Æ‚Å‚ ‚ê‚΁A‚»‚Ì‚Q‚ŏЉ‚½•û–@‚ªƒIƒXƒXƒ‚Å‚·B

’ˆÓ“_H

‚¿‚å‚Á‚Æ–¢Šm”F‚È‚Ì‚Å‚·‚ªA¡‰ñ‚Ì•û–@‚ðÅŒã‚ÉŽ‚Á‚Ä‚«‚½‚Ì‚Á‚Ă̂́AŽÀ‚ÍIE‚Å‚¤‚Ü‚­CSS‚ª“K—p‚³‚ê‚È‚¢ê‡‚ª‚Å‚½‚̂ŁAŒŸØ‚µ‚Ä‚½‚çÅŒã‚É‚È‚Á‚½‚Æ‚¢‚¤BBB

¡‰ñ‚ÍjQuery1.4‚©‚ç‚Ì•û–@‚ŏ‘‚¢‚Ä‚¢‚Ü‚·‚ªA‚»‚Ìhref‚Ì•”•ªAƒ[ƒJƒ‹ŠÂ‹«‚ÅŠm”F‚µ‚悤‚ƁAƒ[ƒJƒ‹’†‚ÌCSS‚ð‘Š‘ÎŽw’è‚Å‚¢‚ê‚é‚ÆIE‚ÅCSS‚ª“K—p‚³‚ê‚Ü‚¹‚ñ‚Å‚µ‚½B‘¼‚ÌFirefox‚âChrome‚È‚Ç‚Å‚Í–â‘è‚È‚­•\Ž¦‚³‚ꂽ‚Ì‚Å‚·‚ªAIE‚¾‚¯‚Í6`8‚¢‚¸‚ê‚àƒ_ƒ‚Å‚µ‚½Bhttp://‚©‚ç‚̐â‘ÌŽw’è‚ɐ؂è‘Ö‚¦‚½‚Æ‚±‚ëIE‚Å‚à“K—p‚³‚ꂽ‚Æ‚¢‚¤B‚»‚̈Ⴂ‚ª‚æ‚­‚í‚©‚Á‚Ä‚¢‚È‚¢‚Ì‚Å‚·‚ªA‚à‚µ‚©‚µ‚½‚獡‰ñ‚Ì•û–@‚ł́Aâ‘΃pƒX‚Å‚ÌŽw’肪•K—v‚©‚à‚µ‚ê‚Ü‚¹‚ñB

‚¿‚Ȃ݂ɁA¡‰ñ‚̏‘‚«•û‚Å‚È‚­Aattr()ƒƒ\ƒbƒh‚ł̒ljÁ‚à“¯—l‚É‚¤‚Ü‚­“K—p‚³‚ê‚Ü‚¹‚ñ‚Å‚µ‚½B

—˜—p‚·‚éÛ‚́Aƒuƒ‰ƒEƒUƒ`ƒFƒbƒN‚ð‚¨‚í‚·‚ꂸ‚ɁB