ÀÚ¹Ù½ºÅ©¸³Æ® °³¹ßÀ» Çϱâ Àü¿¡ ²À Çѹø ÀÐ¾î º¸¼¼¿ä. - ÀÚ¹Ù ½ºÅ©¸³Æ® °³¹ß Áöħ
ÃÖ¼±ÀÇ ¿¹Á¦¿¡ °üÇÑ ±ÛÀ» ¾²´Â°ÍÀº ´Ù¼Ò Æ®¸¯À¸·Î ´À²¸Áö´Â ÀÛ¾÷ÀÌ´Ù. µ¶ÀÚµé ´Ù¼ö¿¡°Ô´Â, ÀÚ½ÅÀÌ Áö±Ý ÀÐÀ¸·Á°í ÇÏ´Â ±ÛÀÌ ¸Å¿ì ¸íÈ®Çϸç, ½Ç·Î Àϸ®ÀÖ´Â °ÍÀ¸·Î º¸¿©Áú °ÍÀÌ´Ù.
±×·¯³ª, À¥À» µÑ·¯º¸°í, ¶Ç Áö³ ¼ö³â°£ ³»°Ô °Ç³×¾îÁø ´Ù¸¥ °³¹ßÀÚµéÀÇ Äڵ带 º¸¸é¼ ´À³¤ °ÍÀº, À¥¿¡¼ ½ÇÁ¦ »ç¿ëµÇ´Â ÄÚµåÀÇ ¼¼°è¿¡´Â »ó´çÈ÷ ºñ»ó½ÄÀûÀÎ ÀϵéÀÌ ¸¹À¸¸ç, ¶ÇÇÑ ¡°Àϸ®ÀÖ°í, ³í¸®ÀûÀÎ Àϵ顱 À̶ó´Â °ÍÀº, ÀÏ´Ü ´ç½ÅÀÌ ÇÁ·ÎÁ§Æ®¿¡ ÅõÀԵǰí ÇÁ·ÎÁ§Æ®ÀÇ µ¥µå¶óÀÎÀÌ ½º¹°°Å¸®¸ç ´Ù°¡¿À°í ÀÖ´Â »óȲ¿¡¼´Â Á߿伺 ¸ñ·Ï¿¡¼ Àú¸¸Ä¡ ¹ØÀ¸·Î Ã߶ôÇØ ³»·Á°£´Ù´Â °ÍÀÌ´Ù.
µû¶ó¼ ³ª´Â ÀÌ ±ÛÀ» ¾²±â·Î °á½ÉÇߴµ¥, ÀÌ ±ÛÀº Áö³ ¼ö³â°£ ³»°¡ ÃàÀûÇØ ¿Â ¿¹Á¦¿Í Á¶¾ðµéÀÇ ¸ðÀ½À̸ç, ±×µé ´ëºÎºÐÀº ³»°¡ Á÷Á¢ ½ÇÇèÇØ º» °ÍµéÀÌ´Ù. ¾Æ·¡¿¡¼ Á¶¾ðÇÏ´Â °ÍµéÀ» °¡½¿¿¡ »õ±â°í, ´ç½ÅÀÇ ³ú ÇÑÆí¿¡ °ø°£À» ¸¶·ÃÇؼ ±×°ÍµéÀ» ÀúÀåÇØµÎ±æ ¹Ù¶õ´Ù – ÇÊ¿äÇÒ °æ¿ì, »ý°¢ÇÒ ÇÊ¿äµµ ¾øÀÌ Àû¿ëÇÒ ¼ö ÀÖµµ·Ï ¸»ÀÌ´Ù. ¹°·Ð, ´ç½ÅÀÌ ³» ÀÇ°ß¿¡ ¹Ý´ëÇÒ ¼ö ÀÖÀ¸¸ç, ¹Ý´ëÀÇ°ßÀº ¾ÆÁÖ ÁÁÀº °ÍÀÌ´Ù – Áö±ÝºÎÅÍ ÀÐ¾î ³ª°¡´Â °Íµé¿¡ ´ëÇØ »ý°¢À» ÇÏ°í, ´õ ÁÁÀº ÇØ°áÃ¥À» ãÀ» ¼ö ÀÖµµ·Ï ¾ÇÀü°íÅõÇØ¾ß ÇÒ °ÍÀÌ´Ù. ¾î·µç, ³ª´Â ¾Æ·¡ÀÇ ¿øÄ¢µéÀ» ÁöŲ °á°ú ²Ï ´É·ÂÀÖ´Â °³¹ßÀÚ°¡ µÉ ¼ö ÀÖ¾ú°í, ´Ù¸¥ °³¹ßÀÚµéÀÌ ³» Äڵ带 ÀÀ¿ëÇϴ°͵µ ´õ ½¬¿öÁ³´Ù..
ÀÌ ±ÛÀº ¾Æ·¡¿Í °°Àº ±¸Á¶¸¦ °¡Áø´Ù:
- À̸§À» ºÒ·¯ ÁÖ¼¼¿ä – ½±°í, ª°í, °¡µ¶¼º ÀÖ´Â º¯¼ö/ÇÔ¼ö À̸§µé
- Àü¿ªº¯¼ö¸¦ ÇÇÇضó
- ¾ö°ÝÇÑ ÄÚµù ½ºÅ¸ÀÏ¿¡ ÁýÂøÇ϶ó
- ÇÊ¿äÇÑ ¸¸Å ÁÖ¼®À» ´Þ°í, ³²¹ßÇÏÁö´Â ¸»¶ó
- ´Ù¸¥ ±â¼úÀ» ¼¯Áö ¸»¾Æ¶ó
- ÇÊ¿äÇÏ´Ù¸é Ãà¾àÇ¥±â¸¦ »ç¿ëÇضó
- ¸ðµâÈ – ÇÑ°¡Áö ÀÏ¿¡ ÇÑ°¡Áö ÇÔ¼ö
- Á¡ÁøÀûÀ¸·Î ¹ßÀü½ÃÄѶó
- ¼³Á¤°ú ¹ø¿ªÀ» ¹Þ¾Æµé¿©¶ó
- °úµµÇÑ ³×½ºÆÃÀ» ÇÇÇضó
- ·çÇÁ¸¦ ÃÖÀûÈÇضó
- DOM Á¢±ÙÀ» ÃÖ¼ÒÈÇضó
- ºê¶ó¿ìÀúÀÇ º¯´ö¿¡ ±¼º¹ÇÏÁö ¸»¾Æ¶ó
- ¾î¶² µ¥ÀÌÅ͵µ ½Å·ÚÇÏÁö ¸»¾Æ¶ó
- ÀÚ¹Ù½ºÅ©¸³Æ®·Î ±â´ÉÀ» Ãß°¡ÇϵÇ, ³Ê¹« ¸¹Àº ³»¿ëÀ» Ãß°¡ÇÏÁö´Â ¸»¾Æ¶ó
- °ÅÀÎÀÇ ¾î±ú À§¿¡¼ ÀÏÇضó
- °³¹ß ÄÚµå¿Í ½ÇÁ¦ ÄÚµå´Â ´Ù¸£´Ù
À̸§À» ºÒ·¯ ÁÖ¼¼¿ä – ½±°í, ª°í, °¡µ¶¼º ÀÖ´Â º¯¼ö/ÇÔ¼ö À̸§µé
ÀÌ°ÍÀº º°·Î ¸Ó¸®¸¦ ¾µ ÇÊ¿äµµ ¾ø´Â ÀÏÀÓ¿¡µµ ºÒ±¸ÇÏ°í, x1, fe2, xbqne °°Àº º¯¼öÀ̸§ – ¶Ç´Â, ±× ¹Ý´ë·Î, incrementorForMainLoopWhichSpansFromTenToTwenty, createNewMemberIfAgeOverTwentyOneAndMoonIsFull °°Àº °ÍµéÀ» ¾ó¸¶³ª ÀÚÁÖ º¸°Ô µÇ´ÂÁö, ²ûÁ÷ÇÒ Á¤µµÀÌ´Ù.
ÀÌ·¯ÇÑ °Íµé Áß ¾î¶²°Íµµ ¾µ¸ðÀÖ¾î º¸ÀÌÁö ¾Ê´Â´Ù – ÁÁÀº º¯¼ö¸í/ÇÔ¼ö¸íÀº ÀÌÇØÇϱ⠽±°í, ±×°ÍÀÌ ¾î¶² ÀÏÀ» ÇÏ´ÂÁö ¾Ë ¼ö ÀÖ°Ô ÇÏ´Â °ÍÀ̸ç, ±× ÀÌ»óµµ, ±× ÀÌÇϵµ ¾Æ´Ï´Ù. ¿ì¸®°¡ ÇÇÇØ¾ß ÇÒ ÇÔÁ¤Àº, °ª°ú ±â´ÉÀ» À̸§¿¡ ÇÕÃļ ³Ö´Â °ÍÀÌ´Ù. ¿¹¸¦ µé¾î, ¹ýÀûÀ¸·Î À½ÁÖ°¡ Çã¿ëµÇ´Â ³ªÀÌÀΰ¡() ¿Í °°Àº ÇÔ¼ö¸íÀÌ 18¼¼ ÀÌ»óÀΰ¡() °°Àº ÇÔ¼ö¸íº¸´Ù Á»´õ ¾µ¸ðÀִµ¥, ¿Ö³ÄÇÏ¸é ³ª¶óº°·Î À½ÁÖ°¡ Çã¿ëµÇ´Â ³ªÀÌ°¡ ´Ù¸£±â ¶§¹®À̸ç, ³ªÀÌ¿¡ µû¶ó Á¦Çѹ޴ °ÍÀÌ À½ÁÖ»Ó¸¸Àº ¾Æ´Ï±â ¶§¹®ÀÌ´Ù.
Çë°¡¸®½Ä Ç¥±â¹ýÀº ¹Þ¾ÆµéÀϸ¸ÇÑ ¸í¸í¹ýÀε¥(°í·ÁÇÒ¸¸ÇÑ ´Ù¸¥ ¸í¸í¹ýµéµµ ÀÖ´Ù), ÀÌ°ÍÀ» »ç¿ëÇÒ °æ¿ì, ´Ü¼øÈ÷ ¡°ÀÌ°ÍÀÌ ¹«¾ùÀΰ¡¡± »Ó¸¸ ¾Æ´Ï¶ó ¡°¹«¾ùÀ» ±â´ëÇϴ°¡¡± ¿ª½Ã ¾Ë ¼ö Àֱ⠶§¹®ÀÌ´Ù.
¿¹¸¦ µé¾î, familyName °°Àº º¯¼ö¸íÀ» ½á¾ß ÇÏ°í, ±× º¯¼ö°¡ ¹®ÀÚ¿ÀÌ µÉ °Å¶ó¸é, ÀÌ°ÍÀ» sFamilyName(¿ªÁÖ:string(¹®ÀÚ¿)ÀÇ s ÀÌ´Ù) °ú °°ÀÌ ¾µ ¼ö Àִµ¥, ÀÌ°ÍÀÌ Çë°¡¸®½Ä Ç¥±â¹ýÀÌ´Ù. member¶ó À̸§ÁöÀº °´Ã¼°¡ ÀÖ´Ù¸é oMember(object(°´Ã¼)ÀÇ o)¿Í °°ÀÌ ¾µ °ÍÀÌ°í, ºÒ¸° º¯¼öÀÎ isLegalÀº bIsLegal °ú °°ÀÌ ¾´´Ù. ÀÌ¿Í °°ÀÌ ÀÛ¼ºÇÏ¸é ¾î¶² »ç¶÷¿¡°Ô´Â ´ë´ÜÈ÷ ¸¹Àº Á¤º¸°¡ µÇÁö¸¸, ´Ù¸¥ »ç¶÷¿¡°Ô´Â Ãß°¡ÀûÀÎ ºÎ´ãÀÌ µÇ±âµµ ÇÑ´Ù – ÀÌ ¹æ¹ýÀ» »ç¿ëÇÒÁö ¾ÈÇÒÁö´Â ¿ÏÀüÈ÷ ´ç½ÅÀÇ ÀÚÀ¯ÀÌ´Ù.
¿µ¾î¸¸À» »ç¿ëÇÏ´Â °Í ¿ª½Ã ±¦ÂúÀº ¹æ¹ýÀÌ´Ù. ÇÁ·Î±×·¥ ¾ð¾îµéÀº ¿µ¾î·Î µÇ¾î ÀÖ°í, µû¶ó¼ ÄÚµåÀÇ ³ª¸ÓÁö ºÎºÐ ¿ª½Ã ¿µ¾î·Î ¾²´Â °ÍÀÌ ³í¸®ÀûÀÌ´Ù. Çѱ¹Àΰú ½½·Îº£´Ï¾ÆÀÎÀÌ ÀÛ¼ºÇÑ Äڵ带 Çѵ¿¾È µð¹ö±ëÇغ¸¾Ò´ø °æÇèÀÌ Àִµ¥, ±× ¾ð¾î¸¦ ¸ð±¹¾î·Î »ç¿ëÇÏÁö ¾Ê´Â ÀÔÀå¿¡¼ ±×°ÍÀº °áÄÚ À¯ÄèÇÑ ÀÏÀº ¾Æ´Ï¾ú´Ù°í ¾ê±âÇؾ߰ڴÙ..
´ç½ÅÀÇ Äڵ带 ÇϳªÀÇ ³ª·¡À̼ÇÀ¸·Î °£ÁÖÇغ¸¶ó. Çà°ú ÇàÀ» Àо°¡¸é¼, ¾î¶² ÀÏÀÌ ÀϾ°í ÀÖ´Â °ÍÀÎÁö ÀÌÇØÇÒ ¼ö ÀÖ´Ù¸é, ¾ÆÁÖ ÁÁ´Ù. ¸¸¾à ´ç½ÅÀÌ ³í¸®Àû È帧À» ÀÌÇØÇϱâ À§¿¡ º°µµÀÇ ¿¬½ÀÀå¿¡ ±×¸²À» ±×·Á¾ß ÇÒ ÇÊ¿ä°¡ ÀÖ´Ù¸é, ´ç½ÅÀÇ Äڵ忡´Â Ãß°¡ÀûÀÎ ÀÛ¾÷ÀÌ ÇÊ¿äÇÑ °ÍÀÌ´Ù. Çö½Ç ¼¼°è¿ÍÀÇ ºñ±³°¡ ÇÊ¿äÇÏ´Ù¸é, µµ½ºÅ俹ÇÁ½ºÅ°ÀÇ ÀúÀÛÀ» Àо´Â °Íµµ ±¦ÂúÀºµ¥ – ³ª´Â 14°³ÀÇ ·¯½Ã¾Æ À̸§µé(°Ô´Ù°¡ ±×Áß 4°³´Â ÇʸíÀ̾ú´Ù)ÀÌ µîÀåÇÏ´Â ÆäÀÌÁö¿¡¼ °¥ÇǸ¦ ÀâÁö ¸øÇÏ°Ô µÇ¾î ¹ö·È´Ù. Äڵ带 ÀÌ·±½ÄÀ¸·Î ÀÛ¼ºÇÏ¸é ¾ÈµÈ´Ù – Äڵ尡 ¿¹¼úÇ°ÀÌ µÉ Áö´Â ¸ð¸£°ÚÁö¸¸, °áÄÚ ÁÁ´Ù°í´Â Çϱ⠾î·Æ´Ù.
Àü¿ªº¯¼ö¸¦ ÇÇÇضó
Àü¿ª º¯¼ö¸í°ú ÇÔ¼ö¸íÀº, ¹ÏÀ»¼ö ¾øÀ» Á¤µµ·Î ³ª»Û ¹ß»óÀÌ´Ù. ÀÌÀ¯´Â, ÇϳªÀÇ ÆäÀÌÁö¿¡ Æ÷ÇÔµÈ ¸ðµç ÀÚ¹Ù½ºÅ©¸³Æ® ÆÄÀϵéÀÌ ÇϳªÀÇ ¿µ¿ª¿¡¼ ½ÇÇàµÇ±â ¶§¹®ÀÌ´Ù. ¸¸¾à Äڵ忡 Àü¿ª º¯¼ö¸íÀ̳ª ÇÔ¼ö¸íÀÌ ÀÖ´Ù¸é, ´ç½ÅÀÇ ½ºÅ©¸³Æ® ÀÌÈÄ¿¡ ½ÇÇàµÇ´Â ½ºÅ©¸³Æ®¿¡ °°Àº º¯¼ö¸í/ÇÔ¼ö¸íÀÌ ÀÖÀ» °æ¿ì ±×°ÍÀ» µ¤¾î½á¹ö¸®°Ô µÈ´Ù.
Àü¿ª ¸í¸íÀ» ÇÇÇÏ´Â ¸î°¡Áö ¹æ¹ýµéÀÌ Àִµ¥, ÀÌÁ¦ ±×°ÍÀ» Çϳª¾¿ »ìÆ캸°Ú´Ù. ´ç½ÅÀÌ 3°³ÀÇ ÇÔ¼ö¿Í ÇϳªÀÇ º¯¼ö¸¦ °®°í ÀÖ´Ù°í °¡Á¤Çغ¸ÀÚ:
<ol style="padding-left: 2em; ">
°´Ã¼ ¸®ÅÍ·²À» »ç¿ëÇؼ, ±×°ÍµéÀÌ µ¤¾î½áÁö´Â °ÍÀ» ¸·À» ¼ö ÀÖ´Ù:
<ol style="padding-left: 2em; ">
ÀÌ·¸°Ô ÇÏ¸é µÇ´Âµ¥, ´ÜÁ¡ÀÌ ÀÖ´Ù – ÇÔ¼ö¸¦ È£ÃâÇϰųª º¯¼öÀÇ °ªÀ» º¯°æÇϱâ À§Çؼ´Â Ç×»ó ÁÖ °´Ã¼ÀÇ À̸§À» ÅëÇؾ߸¸ ÇÑ´Ù: init() ´Â ÀÌÁ¦ myNameSpace.init() ÀÌ°í, current´Â ÀÌÁ¦ myNameSpace.current ÀÌ°í, ÀÌ·± ½ÄÀÌ´Ù. ÀÌ°ÍÀº Á» ¹ø°Å·Ó°í ¹Ýº¹ÀûÀÌ´Ù.
À͸íÀÇ ÇÔ¼ö·Î Àüü¸¦ °¨½Î¼ ¿µ¿ªÀ» º¸È£ÇÏ´Â °ÍÀÌ Á» ´õ ½±´Ù. ÀÌ°ÍÀº ¶ÇÇÑ function name() ÀÇ ¹®¹ýÀ» name:function) À¸·Î ¹Ù²Ü ÇÊ¿äµµ ¾ø´Ù. ÀÌ·¯ÇÑ ±â¹ýÀ» ¸ðµâ ÆÐÅÏÀ̶ó°í ºÎ¸¥´Ù:
<ol style="padding-left: 2em; ">
ÇÏÁö¸¸, ¿©±â¿¡µµ ¹®Á¦´Â ÀÖ´Ù. À̰͵é Áß ¾î¶²°Íµµ, ´õÀÌ»ó ¿ÜºÎ¿¡¼ »ç¿ëÇÒ ¼ö ¾ø°Ô µÈ´Ù. ¿ÜºÎ¿¡¼ »ç¿ëÇÏ°íÀÚ ÇÑ´Ù¸é, À̰͵éÀ» return ¼±¾ðÀ¸·Î °¨½Î¾ß ÇÑ´Ù:
<ol style="padding-left: 2em; ">
°¡¸¸È÷ º¸¸é, ÀÌ°ÍÀº Çϳª¸¦ ´Ù¸¥°Í°ú ¿¬°áÇÑ´Ù´Â °Í, ±×¸®°í ¹®¹ýÀÌ ¹Ù²ï´Ù´Â Á¡¿¡¼ ù¹ø° »óÀÚ¿¡¼ÀÇ ¿¹Á¦¿Í Èí»çÇØÁ®¹ö·È´Ù. µû¶ó¼, ³ª´Â ´ÙÀ½(¸ðµâ ÆÐÅÏ µå·¯³»±â, ¶ó°í Àаï ÇÑ´Ù)°ú °°ÀÌ ÇÏ´Â °ÍÀ» ¼±È£Çϴµ¥:
<ol style="padding-left: 2em; ">
¼Ó¼º°ú ¸Þ¼µå¸¦ ¹ÝȯÇÏ´Â ´ë½Å, ±×°Í¿¡ ´ëÇÑ Æ÷ÀÎÅ͸¦ ¹ÝȯÇÏ°í ÀÖ´Ù. ÀÌ·¸°Ô ÇÏ¸é ¿ÜºÎ¿¡¼ ÇÔ¼ö¸¦ È£ÃâÇÏ°í º¯¼ö¿¡ Á¢±ÙÇϱâ À§ÇØ myNameSpace ¸¦ °ÅÃÄ¾ß ÇÒ ÇÊ¿ä°¡ ¾ø¾îÁø´Ù.
ÀÌ°ÍÀº ¶ÇÇÑ ÇÔ¼ö¿¡ ´ëÇØ °øÅëÀûÀÎ º°¸íÀ» °®°Ô Çϴµ¥, ÀÌ·¸°Ô ÇÔÀ¸·Î¼ ³»ºÎÀû ¸µÅ©¿¡¼´Â ±æ°í ¼¼úÀûÀÎ À̸§À» »ç¿ëÇϸ鼵µ, ¿ÜºÎ¿¡¼ È£ÃâÇÒ¶§´Â ªÀº À̸§À¸·Î È£ÃâÇÒ ¼ö ÀÖ°Ô²û ÇÑ´Ù:
<ol style="padding-left: 2em; ">
myNameSpace.set()¸¦ È£ÃâÇϸé change() ¸Þ¼µå°¡ ½ÇÇàµÈ´Ù.
ÇÔ¼ö³ª º¯¼ö Áß ¾î¶²°Íµµ ¿ÜºÎ¿¡¼ »ç¿ëÇÒ ÇÊ¿ä°¡ ¾ø´Ù¸é, °£´ÜÇÏ°Ô Àüü¸¦ ¶Ç ÇϳªÀÇ °ýÈ£·Î °¨½Î¹ö¸®¸é µÇ´Âµ¥, ÀÌ·¸°Ô ÇÏ¸é µû·Î À̸§À» ÁÖÁö ¾Ê¾Æµµ ½ÇÇàµÇ°Ô µÈ´Ù:
<ol style="padding-left: 2em; ">
ÀÌ·¸°Ô ÇÔÀ¸·Î¼ ¸ðµç°ÍÀ» ÇϳªÀÇ ÀÛÀº Æ÷Àå´ÜÀ§·Î ºÐ¸®ÇÏ¸ç ¿ÜºÎ¿¡¼´Â Á¢±ÙÇÒ ¼ö ¾øµµ·Ï, ÇÏÁö¸¸ ³»ºÎ¿¡¼´Â ¾ÆÁÖ ½±°Ô º¯¼ö¿Í ÇÔ¼ö¸¦ °øÀ¯ÇÒ ¼ö ÀÖ°Ô µÈ´Ù.
¾ö°ÝÇÑ ÄÚµù ½ºÅ¸ÀÏ¿¡ ÁýÂøÇ϶ó
ÀÚ¹Ù½ºÅ©¸³Æ® ¹®¹ý¿¡ ÀÖ¾î¼, ºê¶ó¿ìÀúµéÀº ´ë´ÜÈ÷ °ü´ëÇÏ´Ù. ÇÏÁö¸¸ ÀÌ°ÍÀ» ÀÌÀ¯·Î, ºê¶ó¿ìÀúÀÇ Æ¯¼º¿¡ ÀÇÁ¸ÇÏ´Â Çã¼úÇÑ Äڵ带 ÀÛ¼ºÇؼ´Â ¾ÈµÈ´Ù.
´ç½ÅÀÇ ÄÚµåÀÇ ¹®¹ý Á¡¼ö¸¦ ÃøÁ¤Çغ¸´Â °¡Àå ½¬¿î ¹æ¹ýÀº, ±×°ÍÀ» JSLint — ÀÚ¹Ù½ºÅ©¸³Æ® À¯È¿¼º °ËÁõ Åø¿¡¼ ½ÇÇàÇغ¸´Â °ÍÀÌ´Ù. ÀÌ°ÍÀº ¹®¹ý °æ°í¿Í ±× Àǹ̿¡ ´ëÇØ »ó¼¼ÇÑ º¸°í¼¸¦ Á¦°øÇÑ´Ù. Äڵ带 ÀúÀåÇÒ ¶§ ÀÚµ¿À¸·Î À¯È¿¼º°ËÁõÀ» ÇØ ÁÖ´Â ¿¡µðÅÍ È®Àåµéµµ ÀÖ´Ù(¿¹¸¦ µé¾î, JS Tools for TextMate).
JSLint ÀÇ °á°ú¸¦ »ìÆ캸°Ô µÇ¸é – °³¹ßÀÚÀÎ Douglas Crockford °¡ ¸»ÇϵíÀÌ – »óó¸¦ ¹ÞÀ» ¼öµµ ÀÖ´Ù. ¾î·µç ÀÌ°ÍÀ» ÅëÇØ Àüº¸´Ù ÈξÀ ³ªÀº Äڵ带 »ç¿ëÇÏ°Ô µÇ¾úÀ¸¹Ç·Î, ³ª´Â TextMate JS ¸¦ ¼³Ä¡Çؼ ³» Äڵ尡 JSLintÀÇ Á¤¹ÐÇÑ °Ë»ç¸¦ ¹Þ°Ô²û ÇÏ°í ÀÖ´Ù.
±ò²ûÇÏ°í À¯È¿ÇÑ ÄÚµå´Â, °íÃÄ¾ß ÇÒ È¥µ¿½º·¯¿î ¹ö±×°¡ Àû´Ù´Â °ÍÀ» ÀǹÌÇÏ°í, ´Ù¸¥ °³¹ßÀÚ¿¡°Ô ½±°Ô Àü´ÞÇÏ´Â °ÍÀ» ÀǹÌÇϸç, ´õ ³ªÀº º¸¾ÈÀ» ÀǹÌÇÑ´Ù. ¸¸¾à ´ç½ÅÀÌ Äڵ带 ½ÇÇà½ÃÅ°±â À§ÇØ Æ¯Á¤ÇÑ ÇÙ¿¡ ÀÇÁ¸ÇÑ´Ù¸é, °°Àº ÇÙÀ» »ç¿ëÇÏ´Â »ç¶÷¿¡°Ô´Â º¸¾È ³ëÃâÀÌ µÇ¾î ¹ö¸°´Ù. ¶ÇÇÑ, ÀÌ·¯ÇÑ ÇÙ µéÀÌ ºê¶ó¿ìÀú¿¡ ÀÇÇØ °è¼ÓÇؼ °íÃÄÁö°í Àֱ⠶§¹®¿¡, ´ç½ÅÀÇ Äڵ尡 ºê¶ó¿ìÀúÀÇ ´ÙÀ½ ¹öÀü¿¡¼´Â ÀÛµ¿À» ÁßÁöÇÒ ¼öµµ ÀÖ´Ù.
À¯È¿ÇÑ ÄÚµå´Â ¶ÇÇÑ ½ºÅ©¸³Æ®¸¦ ÅëÇØ ´Ù¸¥ Çü½ÄÀ¸·Î º¯°æÇÒ ¼ö ÀÖ´Ù – ÇÙÀ» ÀÌ¿ëÇÑ Äڵ带 º¯°æÇϱâ À§Çؼ´Â ¼öÀÛ¾÷ÀÌ ÇÊ¿äÇÏ´Ù.
ÇÊ¿äÇÑ ¸¸Å ÁÖ¼®À» ´Þ°í, ³²¹ßÇÏÁö´Â ¸»¶ó
ÁÖ¼®Àº ´Ù¸¥ °³¹ßÀÚµé(±×¸®°í, ¸î´Þµ¿¾È ´Ù¸¥ ÀÛ¾÷À» ÇÏ´Ù°¡ ÀÌ Äڵ带 ´Ù½Ã º¸°Ô µÉ ´ç½Å ¿ª½Ã)¿¡°Ô º¸³»´Â ¸Þ¼¼ÁöÀÌ´Ù. ÁÖ¼®À» ¾µ °ÍÀÎÁö ¸» °ÍÀÎÁö¿¡ ´ëÇØ ¼ö³â°£ °ÝÇÑ ³íÀïµéÀÌ ÀÖ¾î ¿Ô´Âµ¥, ¿©±â¿¡ ÀÖ¾î¼ÀÇ ÁÖµÈ ³íÁ¡Àº, ÁÁÀº ÄÚµå´Â ±× ÀÚ½ÅÀ» Àß ¼³¸íÇÑ´Ù´Â °ÍÀÌ´Ù.
ÀÌ·¯ÇÑ ³íÁ¡¿¡¼ ³»°¡ ÈìÀ¸·Î Áö¸ñÇÏ´Â °ÍÀº, ¼³¸íÀ̶õ °ÍÀº ±ØÈ÷ ¸ñÀûÀûÀÎ °ÍÀ̶ó´Â °ÍÀÌ´Ù – ¸ðµç °³¹ßÀÚµéÀÌ ÀÌ Äڵ尡 ¹«½¼ ÀÏÀ» ÇÏ°í ÀÖ´ÂÁö Á¤È®È÷ µ¿ÀÏÇÑ ÀÌÇظ¦ °¡Áú °ÍÀ̶ó°í ¿¹»óÇÒ ¼ö´Â ¾ø´Ù.
ÁÖ¼®À» ¿Ã¹Ù¸£°Ô Ãß°¡ÇÑ´Ù¸é, ¾Æ¹«µµ ÇÇÇظ¦ ÀÔÁö ¾Ê´Â´Ù. ÀÌ ±ÛÀÇ ¸¶Áö¸· ºÎºÐ¿¡¼ ÀÌ ¹®Á¦¸¦ ´Ù½Ã ´Ù·ç°ÚÁö¸¸, ´ç½ÅÀÌ Äڵ忡 ³²°ÜµÐ ÁÖ¼®À» ÃÖÁ¾ »ç¿ëÀÚ°¡ º»´Ù¸é ±×°ÍÀº ¹º°¡ À߸øµÈ °ÍÀÌ´Ù.
´Ù½ÃÇѹø ¸»ÇÏÀÚ¸é ¹®Á¦´Â Áß¿ë ÀÌ´Ù. Áß¿äÇÑ ÇÒ ¸»ÀÌ ÀÖ´Ù¸é ÁÖ¼®À» ³²±â°í, ÁÖ¼®À» ³²±æ °ÍÀ̶ó¸é /* */ ¼Ó¿¡ ³²°Ü¶ó. //¸¦ ÀÌ¿ëÇÏ´Â ÇÑÁÙÀÇ ÁÖ¼®Àº, ¸¸¾à »ç¶÷µéÀÌ ´ç½ÅÀÇ ÁÖ¼®À» Á¦°ÅÇÏÁö ¾Ê°í Äڵ带 ÃÖ¼ÒÈ(¿ªÁÖ:°ø¹é¹®ÀÚ¸¦ Á¦°ÅÇÏ¿© Äڵ带 ¾ÐÃàÇÒ ¶§ ÁٹٲÞÀ» Á¦°ÅÇÏ´Â °æ¿ì°¡ ¸¹´Ù)ÇÒ °æ¿ì ¹®Á¦¸¦ ÀÏÀ¸Å³ ¼ÒÁö°¡ ÀÖÀ¸¸ç, ÀϹÝÀûÀ¸·Î ¸»Çؼ À¶Å뼺ÀÌ ¾ø´Ù
¸¸¾à ´ç½ÅÀÌ ÄÚµåÀÇ ÀϺθ¦ ³ªÁß¿¡ »ç¿ëÇÒ ¸ñÀûÀ¸·Î, ȤÀº µð¹ö±× ÇÒ ¸ñÀûÀ¸·Î ÁÖ¼®Ã³¸®ÇÑ´Ù¸é, ÀÌ ÆÁÀÌ ´ë´ÜÈ÷ À¯¿ëÇÒ °ÍÀÌ´Ù:
<ol style="padding-left: 2em; ">
ÁÖ¼®À» ´Ý´Â */ ¾Õ¿¡ //¸¦ Ãß°¡Çϸé, /*¾Õ¿¡ /¸¦ Ãß°¡Çϰųª »À¸·Î¼, ¾ÆÁÖ ½±°Ô ½ºÅ©¸³Æ® ºí·° Àüü¸¦ ÁÖ¼®ÈÇϰųª, µ¿ÀÛÇÏ´Â ÄÚµå·Î ¹Ù²Ü ¼ö ÀÖ´Ù:
<ol style="padding-left: 2em; ">
À§¿Í °°ÀÌ ¸¸µé¾îÁø Äڵ忡¼´Â, ÁÖ¼®À» ¿©´Â /* ¾Õ¿¡ ÇϳªÀÇ /¸¦ Ãß°¡ÇÔÀ¸·Î¼ À̾îÁö´Â ¿©·¯ ÁÙÀÇ ÁÖ¼®À» µÎ°³ÀÇ ÇÑÁÙ ÁÖ¼®À¸·Î ¸¸µé¾î¼, ¡°ÁÖ¼®À» Ãë¼ÒÇϴ¡± È¿°ú°¡ ÀÖ°í, /* ¿Í */ »çÀÌ¿¡ ÀÖ´Â Äڵ尡 ½ÇÇàµÇµµ·Ï ¸¸µç´Ù. ¸Ç ¾ÕÀÇ /¸¦ Á¦°ÅÇؼ Àüü ºí·°À» ´Ù½Ã ½±°Ô ÁÖ¼®Ã³¸® ÇÒ ¼ö ÀÖ´Ù.
Å« ±Ô¸ðÀÇ ÀÀ¿ë ÇÁ·Î±×·¥¿¡¼´Â, ÁÖ¼®À» JavaDoc style·Î ¹®¼ÈÇÏ¸é ´ë´ÜÈ÷ ¸¹Àº ÀÌÁ¡ÀÌ ÀÖ´Ù – Äڵ带 ÀÛ¼ºÇÔÀ¸·Î¼, Àü¹ÝÀûÀÎ ¹®¼ÀÇ ¾¾¸¦ »Ñ¸®´Â °ÍÀÌ´Ù. ¾ßÈÄ! ÀÇ ÀÎÅÍÆäÀ̽º ¶óÀ̺귯¸®°¡ ¼º°øÀûÀ̾ú´ø ¹è°æ¿¡´Â ÀÌ°ÍÀÌ Æ÷ÇԵǾî ÀÖÀ¸¸ç, ´ç½ÅÀÇ ÇÁ·Î±×·¥À» À§ÇØ µ¿ÀÏÇÑ ¹®¼¸¦ ¸¸µå´Â µµ±¸µµ ÀÖ´Ù. ÀÚ¹Ù½ºÅ©¸³Æ®¿¡ Á» ´õ Àͼ÷ÇØÁö±â Àü¿¡´Â, ÀÌ·¯ÇÑ °Í¿¡ ´ëÇØ Å©°Ô ¿°·ÁÇÒ ÇÊ¿ä´Â ¾ø´Ù – ÀÚ¹Ùµ¶ À» ÀÌ ±Û¿¡¼ ¾ð±ÞÇÑ °ÍÀº ±ÛÀÇ ¿Ï°á¼ºÀ» À§ÇÑ °ÍÀÌ´Ù.
´Ù¸¥ ±â¼úÀ» ¼¯Áö ¸»¾Æ¶ó
´ç½ÅÀÌ ¹®¼ ³»¿¡¼ ÇÊ¿ä·Î ÇÏ´Â ¸ðµç °ÍµéÀ» ÀÚ¹Ù½ºÅ©¸³Æ®¿Í DOM·Î ¸¸µé¾î ³¾ ¼ö ÀÖ±â´Â ÇÏÁö¸¸, ÀÌ°ÍÀÌ °¡Àå È¿À²ÀûÀÎ ¹æ¹ýÀº ¾Æ´Ï´Ù. ´ÙÀ½ÀÇ ÄÚµå´Â, mandatory Ŭ·¡½º¸¦ °¡Áø ¸ðµç ÀÎDz Çʵ忡 ´ëÇØ, ±× ³»¿ëÀÌ ºñ¾î ÀÖ´Ù¸é ºÓÀº»ö Å׵θ®¸¦ ±×¸°´Ù..
<ol style="padding-left: 2em; ">
ÀÌ°ÍÀº µ¿ÀÛÇÑ´Ù. ÇÏÁö¸¸ ÀÌÈÄ ´ç½ÅÀÌ ÀÌ·¯ÇÑ ½ºÅ¸ÀÏ(1px solid red)¿¡ º¯°æÀ» °¡ÇÏ°í ½Í´Ù¸é, ´ç½ÅÀº ÀÚ¹Ù½ºÅ©¸³Æ®¸¦ °Ë»öÇؼ ÇÊ¿äÇÑ À§Ä¡¸¦ ã°í, ±×°ÍÀ» º¯°æÇØ¾ß ÇÒ °ÍÀÌ´Ù. º¯È°¡ º¹ÀâÇÒ¼ö·Ï ¼öÁ¤ÀÛ¾÷ÀÌ Èûµé °ÍÀÌ´Ù. ¶ÇÇÑ, ¸ðµç ÀÚ¹Ù½ºÅ©¸³Æ® °³¹ßÀÚµéÀÌ CSS¿¡ ´É¼÷Çϰųª Èï¹Ì¸¦ °®°í ÀÖ´Â °ÍÀº ¾Æ´Ï¹Ç·Î, °á°ú¹°À» ¼Õ¿¡ Áã±â À§Çؼ´Â ¸¹Àº ÀÛ¾÷ÀÌ ÇÊ¿äÇÒ °ÍÀÌ´Ù. error ¶ó´Â À̸§ÀÇ Å¬·¡½º¸¦ Çϳª Ãß°¡ÇÔÀ¸·Î¼, ½ºÅ¸ÀÏ Á¤º¸°¡ CSS – Á» ´õ ÀûÇÕÇÑ À§Ä¡ – ³»¿¡ ÀÖµµ·Ï ÇÒ ¼ö ÀÖ´Ù:
<ol style="padding-left: 2em; ">
CSS°¡ ¹®¼ Àüü¿¡ °ÉÃÄ Ä³½ºÄÉÀÌµå µÇµµ·Ï ¼³°èµÇ¾ú±â ¶§¹®¿¡, ÀÌ·¯ÇÑ ¹æ½ÄÀÌ ÈξÀ È¿À²ÀûÀÌ´Ù. ¿¹¸¦ µé¾î, ´ç½ÅÀÌ Æ¯Á¤ Ŭ·¡½º¸¦ °¡Áø ¸ðµç div ¿ä¼Ò¸¦ ¼û±â°í ½Í´Ù°í ÇÏÀÚ. ÀÌ·¸°Ô Çϱâ À§Çؼ ¸ðµç div µé¿¡ ´ëÇØ ·çÇÁ¸¦ µ¹¸®°í, Ŭ·¡½º¸¦ üũÇؼ ½ºÅ¸ÀÏ Á¤º¸¸¦ º¯°æÇÒ ¼ö ÀÖ´Ù. ÃÖ±ÙÀÇ ºê¶ó¿ìÀú¿¡¼´Â CSS ¼±ÅÃÀÚ¸¦ ÀÌ¿ëÇؼ ½ºÅ¸ÀÏ Á¤º¸¸¦ º¯°æÇÒ ¼ö ÀÖ´Ù. ÀÌ°ÍÀ» Çϱâ À§ÇØ °¡Àå ½¬¿î ¹æ¹ýÀº ÀÚ¹Ù½ºÅ©¸³Æ®¸¦ ÀÌ¿ëÇؼ ºÎ¸ð ¿ä¼Ò¿¡ Ŭ·¡½º¸¦ Ãß°¡ÇÏ°í, CSSÀÇ element.triggerclass div.selectorclass{} ¶óÀο¡ °ÉÃÄ ´Ù¸¥ ¹®¹ýÀ» Àû¿ëÇÏ´Â °ÍÀ̱ä ÇÏ´Ù. div¸¦ ¼û±â´Â ½ÇÁ¦ ÀÛ¾÷Àº CSSµðÀÚÀ̳ʿ¡°Ô ¸Ã±â´Â °ÍÀÌ ÁÁ´Ù – ±×´Â ±×·¸°Ô Çϱâ À§ÇÑ °¡Àå ÁÁÀº ¹æ¹ýÀ» ¾Ë°í ÀÖÀ» °ÍÀ̱⠶§¹®ÀÌ´Ù.
ÇÊ¿äÇÏ´Ù¸é Ãà¾àÇ¥±â¸¦ »ç¿ëÇضó
Ãà¾àÇ¥±â´Â º¯Ä¢ÀûÀÎ ÁÖÁ¦ÀÌ´Ù: ÇÑ°¡Áö ¸é¿¡¼´Â ´ç½ÅÀÇ ÄÚµå ±æÀ̸¦ ÁÙ¿© ÁÖÁö¸¸, ´Ù¸¥ ¸é¿¡¼´Â ´ç½ÅÀÇ Äڵ带 ³Ñ°Ü¹ÞÀº °³¹ßÀÚµéÀÌ ±× Ãà¾àÀÇ Àǹ̸¦ Àß ÆľÇÇϱ⠾î·Á¿ï ¼ö Àֱ⠶§¹®ÀÌ´Ù. »ç¿ëÇÒ ¼ö ÀÖ´Â(»ç¿ëÇØ¾ß ÇÏ´Â) ÀÛÀº ¸ñ·ÏÀ» º¸¿©ÁÖ°Ú´Ù.
¾Æ¸¶µµ, ´ç½ÅÀÌ ÀÚ¹Ù½ºÅ©¸³Æ®¿¡¼ »ç¿ëÇÏ´Â °Í Áß °¡Àå ¹ü¿ëÀûÀÎ °ÍÀº °´Ã¼ÀÌ´Ù. ±¸½Ä ¹æ¹ý¿¡¼´Â °´Ã¼¸¦ ´ÙÀ½°ú °°ÀÌ Ç¥±âÇߴµ¥:
<ol style="padding-left: 2em; ">
±×·¯³ª, ÀÌ·¸°Ô »ç¿ëÇÑ´Ù¸é °´Ã¼ÀÇ À̸§À» °¢°¢ÀÇ ¼Ó¼ºÀ̳ª ¸Þ¼µå¿¡ ¸ðµÎ »ç¿ëÇØ¾ß ÇÏ°í, ÀÌ°ÍÀº Á» ¹ø°Å·Î¿ï °ÍÀÌ´Ù. ´ë½Å, ´ÙÀ½ÀÇ ±¸Á¶ – °´Ã¼ ¸®ÅÍ·²À̶ó°í ºÒ¸°´Ù – ¸¦ »ç¿ëÇÏ´Â °ÍÀÌ Á» ´õ ³´´Ù:
<ol style="padding-left: 2em; ">
ÀÚ¹Ù½ºÅ©¸³Æ®¿¡¼ ¹è¿Àº ´Ù¼Ò È¥¶õÀ» ÀÏÀ¸Å²´Ù. ¾Æ¸¶µµ, ¸¹Àº ¼öÀÇ ½ºÅ©¸³Æ®¿¡¼ ´ÙÀ½°ú °°ÀÌ ¹è¿À» Á¤ÀÇÇÑ °ÍÀ» º¸°Ô µÉ °ÍÀε¥:
<ol style="padding-left: 2em; ">
Àǹ̾ø´Â ¹Ýº¹ÀÌ´Ù. [ ]¸¦ »ç¿ëÇÏ¿© Ãà¾àÇϸé ÈξÀ ºü¸£°Ô ÀÛ¼ºÇÒ ¼ö ÀÖ´Ù:
<ol style="padding-left: 2em; ">
¸î¸î ±³½À¼¿¡¼ ¡°¿¬°áµÈ ¹è¿associative array¡± À̶ó´Â °³³äÀ» º¸°Ô µÉ °ÍÀÌ´Ù. ÀÌ°ÍÀº À߸øµÈ Ç¥ÇöÀε¥, À妽º°¡ ¾Æ´Ï¶ó ¸í¸íµÈ ¼Ó¼ºÀ» °¡Áø ¹è¿Àº »ç½Ç °´Ã¼ÀÌ¸ç ±×·¸°Ô Á¤ÀǵǾî¾ß Çϱ⠶§¹®ÀÌ´Ù.
Á¶°ÇµéÀº ¡°3¹ú½Ä Ç¥±â¹ýternary notation¡± À¸·Î Ãà¾àÇÒ ¼ö ÀÖ´Ù. ¿¹¸¦ µé¾î, ´ÙÀ½ÀÇ ±¸Á¶´Â ´Ù¸¥ º¯¼öÀÇ °ª¿¡ µû¶ó 1 ¶Ç´Â -1·Î º¯¼öÀÇ °ªÀ» Á¤ÀÇÇÏ°í ÀÖ´Ù:
<ol style="padding-left: 2em; ">
ÀÌ°ÍÀ» ÇÑÁÙ·Î ¾´´Ù¸é:
<ol style="padding-left: 2em; ">
¹°À½Ç¥ ¾Õ¿¡ Àִ°ÍÀº ÀüºÎ Á¶°ÇÀÌ´Ù. ¹Ù·Î ÀÌ¾î¼ ³ª¿À´Â °ªÀº Á¶°ÇÀÌ Âü ÀÏ °æ¿ìÀ̸ç, ÄÝ·Ð µÚ¿¡ ³ª¿À´Â °ªÀº Á¶°ÇÀÌ °ÅÁþÀÎ °æ¿ìÀÌ´Ù. 3¹ú½Ä Ç¥±â¹ýÀº ÁßøµÉ ¼ö Àִµ¥, °¡µ¶¼ºÀ» »ý°¢Çؼ ³ª´Â ±×·¸°Ô ÇÏÁö ¾Ê´Â´Ù.
ÀÚ¹Ù½ºÅ©¸³Æ®¿¡¼ Á¾Á¾ ¹ú¾îÁö´Â ´Ù¸¥ »óȲÀº, º¯¼ö°¡ Á¤ÀǵÇÁö ¾Ê¾ÒÀ» °æ¿ì ÃʱⰪÀ» ÁÖ´Â °ÍÀÌ´Ù. ´ÙÀ½°ú °°ÀÌ:
<ol style="padding-left: 2em; ">
||¸¦ »ç¿ëÇؼ Ãà¾àÇ¥±âÇÒ ¼ö ÀÖ´Ù(¿ªÁÖ:ÀÚ¹Ù½ºÅ©¸³Æ®¿¡¼ or ÀÇ Àǹ̷Π»ç¿ëÇÑ´Ù):
<ol style="padding-left: 2em; ">
v°¡ Á¤ÀǵÇÁö ¾Ê¾ÒÀ» °æ¿ì x¿¡ 10À» ´ëÀÔÇÑ´Ù – ¾ÆÁÖ °£´ÜÇÏ´Ù.
¸ðµâÈ – ÇÑ°¡Áö ÀÏ¿¡ ÇÑ°¡Áö ÇÔ¼ö
ÀÌ°ÍÀº ÀϹÝÀûÀÎ ÇÁ·Î±×·¡¹Ö ¿øÄ¢ Áß¿¡¼ °¡Àå ÁÁÀº °ÍÀÌ´Ù. ÇÑ°¡Áö ÀÏÀ» ÇÏ´Â ÇÔ¼ö¸¦ ÀÛ¼ºÇÔÀ¸·Î¼, ´Ù¸¥ °³¹ßÀÚµéÀÌ µð¹ö±×Çϰųª Äڵ带 ¼öÁ¤ÇÒ ¶§ ¾î¶² ÄÚµåºí·°ÀÌ ¾î¶² ±â´ÉÀ» ¼öÇàÇÏ´ÂÁö ÆľÇÇϱâ À§Çؼ ÄÚµå Àüü¸¦ µé¿©´Ù º¼ ÇÊ¿ä°¡ ¾ø¾îÁö°Ô µÈ´Ù.
ÀÌ·¯ÇÑ ¿øÄ¢Àº ÀϹÝÀûÀÎ ÀÛ¾÷À» À§ÇÑ µµ¿ì¹Ì ÇÔ¼ö¸¦ ¸¸µé¶§µµ ¸¶Âù°¡ÁöÀÌ´Ù. ¿©·¯°¡Áö ´Ù¸¥ ÇÔ¼öµé¿¡ °ÉÃļ °°Àº ÀÛ¾÷À» ¹Ýº¹ÇÑ´Ù¸é, Á» ´õ º¸ÆíÀûÀÎ µµ¿ì¹Ì ÇÔ¼ö¸¦ ¸¸µé°í ±× ±â´ÉÀÌ ÇÊ¿äÇÑ °Í¿¡¼ ±×°ÍÀ» ÀçÈ°¿ëÇϴ°ÍÀÌ ³´´Ù.
¶ÇÇÑ, ÀԷ°ú Ãâ·ÂÀ» ºÐ¸®ÇÏ´Â °Í ¿ª½Ã ÇÔ¼ö ÀÚü ³»¿¡¼ Çã¿ìÀû´ë´Â°Íº¸´Ù´Â ÈξÀ ³´´Ù. ¿¹¸¦ µé¾î, »õ·Î¿î ¸µÅ©¸¦ ¸¸µé¾î³»´Â µµ¿ì¹Ì ÇÔ¼ö¸¦ ¸¸µé°í ½Í´Ù°í ÇÏÀÚ. ÀÌ·±½ÄÀ¸·Î ÇÒ¼öµµ Àִµ¥:
<ol style="padding-left: 2em; ">
¹°·Ð ÀÌ°ÍÀº µ¿ÀÛÇÑ´Ù. ÇÏÁö¸¸, ¸µÅ©¸¦ Àû¿ëÇÏ´Â ¿ä¼Ò¿¡ µû¶ó¼ ´Ù¸¥ ¼Ó¼ºÀ» Ãß°¡ÇØ¾ß ÇÒ ¼öµµ ÀÖ´Ù. ¿¹¸¦ µé¾î:
<ol style="padding-left: 2em; ">
ÀÌ·¸°Ô µÇ¸é ÇÔ¼ö´Â ´õ¿í °íÁ¤ÀûÀÌ µÇ°í, ´Ù¸¥ »óȲ¿¡ Àû¿ëÇϱⰡ Èûµé¾îÁø´Ù. ÀÌ°ÍÀ» ´õ °£°áÇÏ°Ô ÇÏ·Á¸é, ¸µÅ©¸¦ ¹ÝȯÇÏ´Â ÇÔ¼ö¸¦ ¸¸µé°í, ´Ù¸¥ °æ¿ìµéÀº ±×°ÍÀ» ÇÊ¿ä·Î ÇÏ´Â ÁÖ ÇÔ¼ö¿¡¼ ó¸®ÇÏ´Â °ÍÀÌ´Ù. Áï, addLink() ÇÔ¼ö¸¦ Á» ´õ ¹ü¿ëÀûÀÎ createLink() ÇÔ¼ö·Î ¸¸µç´Ù:
<ol style="padding-left: 2em; ">
¸ðµç ÇÔ¼öµéÀÌ ´Ü ÇÑ°¡ÁöÀÇ Àϸ¸ ó¸®Çϵµ·Ï ÇÔÀ¸·Î¼, ÁÖ ÇÔ¼öÀÎ init() ¿¡¼ ±×°Íµé ¸ðµÎ¸¦ Æ÷ÇÔÇϵµ·Ï ÇÒ ¼ö ÀÖ´Ù. ÀÌ·¸°Ô Çϸé ÀÇÁ¸¼ºÀ» üũÇϱâ À§ÇØ ¹®¼ Àüü¸¦ µÚÀû°Å¸± ÇÊ¿ä ¾øÀÌ ÇÁ·Î±×·¥ÀÇ ±â´ÉÀ» ½±°Ô ¹Ù²Ù°í, ƯÁ¤ ±â´ÉÀ» Á¦°ÅÇÒ ¼ö ÀÖ´Ù.
Á¡ÁøÀûÀ¸·Î ¹ßÀü½ÃÄѶó
Á¡ÁøÀû ¹ßÀü, °³¹ßÀÇ ¿øÄ¢À¸·Î¼ÀÇ ÀÌ °³³äÀº Á¡ÁøÀû ¹ßÀü°ú ¿ì¾ÆÇÑ ÈÄÅð¿¡¼ »ó¼¼È÷ ´Ù·ç¾îÁö°í ÀÖ´Ù. ¿äÁ¡¸¸ ¸»ÇÑ´Ù¸é, ´ç½ÅÀÌ ÇØ¾ß ÇÏ´Â ÀÏÀº ƯÁ¤ ±â¼ú¿¡ ÀÇÁ¸ÇÏÁö ¾Ê°í µ¿ÀÛÇÏ´Â Äڵ带 ÀÛ¼ºÇÏ´Â °ÍÀÌ´Ù. ÀÚ¹Ù½ºÅ©¸³Æ®ÀÇ °æ¿ì·Î ÇÑÁ¤ÇÑ´Ù¸é, ½ºÅ©¸³Æ®°¡ ºÒ°¡´ÉÇÑ °æ¿ì(¿¹¸¦ µé¾î ºí·¢º£¸®, ¶Ç´Â ±¤½ÅÀûÀÎ º¸¾È Á¤Ã¥µé ¶§¹®¿¡)¶ó Çصµ »ç¿ëÀÚµéÀÌ ÀÚ½ÅÀÇ ¸ñÀûÀ» ´Þ¼ºÇÒ ¼ö ÀÖ¾î¾ß ÇÑ´Ù´Â °ÍÀÌ´Ù. ±×µéÀÌ ÄÓ ¼ö ¾ø´Â, ȤÀº ÄÑ°í ½Í¾îÇÏÁö ¾Ê´Â ½ºÅ©¸³Æ®°¡ ¾ø´Ù°í Çؼ ±×µéÀÇ ¸ñÀûÀÌ °ÅºÎµÇ¾î¼´Â ¾ÈµÈ´Ù.
ÀÚ¹Ù½ºÅ©¸³Æ® ¾øÀ̵µ °£´ÜÇÏ°Ô ÇØ°áÇÒ ¼ö ÀÖ´Â ¹®Á¦¸¦ ÇØ°áÇϱâ À§ÇØ, º¹ÀâÇÏ°Ô À̸®Àú¸® ²¿ÀÎ °Å´ëÇÑ ±Ô¸ðÀÇ ½ºÅ©¸³Æ®¸¦ ¾ó¸¶³ª ÀÚÁÖ ¸¸µé°Ô µÉÁö ´ç½ÅÀÌ ¹Ì¸® ¾È´Ù¸é ¹«Ã´ ³î¶ö °ÍÀÌ´Ù. ³»°¡ ¸¸³µ´ø ÇÑ°¡Áö ¿¹ ´Â, ´Ù¾çÇÑ µ¥ÀÌÅÍ: À¥, À̹ÌÁö, ´º½º µî ¸¦ °Ë»öÇÏ´Â °Ë»ö ÆäÀÌÁö¿¡¼¿´´Ù.
ù ¹öÀü¿¡¼´Â, ¼·Î ´Ù¸¥ °Ë»ö¿É¼ÇµéÀº action ¼Ó¼ºÀ» µ¤¾î¾²°Ô²û ¸¸µé¾îÁø °¢°¢ÀÇ ¸µÅ©¸¦ ÅëÇؼ, ¼¹öÀÇ ¼·Î ´Ù¸¥ ½ºÅ©¸³Æ®¿¡ Á¢±ÙÇÔÀ¸·Î¼ °Ë»öÇÏ´Â ¹æ½ÄÀ̾ú´Ù.
¹®Á¦´Â ÀÌ°ÍÀÌ´Ù: ÀÚ¹Ù½ºÅ©¸³Æ®°¡ ²¨Á® ÀÖ´Â °æ¿ì¿¡µµ ¸µÅ©´Â ¿©ÀüÈ÷ º¸ÀÌÁö¸¸, ¸ðµç °Ë»öÀº ±âº»°ªÀÎ À¥ °Ë»öÀÇ °á°ú¸¦ °¡Á®¿ÔÀ¸¸ç ÀüÇô ¹Ù²îÁö ¾Ê¾Ò´Ù. ÇØ°áÃ¥Àº °£´ÜÇß´Ù: ¸µÅ© ´ë½Å ¶óµð¿À ¹öÆ°À» »ç¿ëÇؼ °Ë»ö ¿É¼ÇÀ» ¼±ÅÃÇϵµ·Ï Çß°í, º¹ÀâÇÑ ÀÛ¾÷Àº ¼¹ö¿¡¼ ÀÌ·ç¾îÁöµµ·Ï ÇÑ °ÍÀÌ´Ù.
ÀÌ·¸°Ô ÇÔÀ¸·Î¼ ¸ðµç °æ¿ì¿¡ °Ë»öÀÌ Á¤È®È÷ ÀÛµ¿ÇßÀ» »Ó¸¸ ¾Æ´Ï¶ó, »ç¶÷µéÀÌ »ç¿ëÇÑ °Ë»ö¿É¼Ç ¼±È£µµ¸¦ Åë°è³»´Â°Íµµ ½¬¿öÁ³´Ù. Á¤È®ÇÑ HTML ±¸Á¶¸¦ »ç¿ëÇÔÀ¸·Î¼ ¿ì¸®´Â Æû ¾×¼ÇÀ» º¯°æÇϱâ À§ÇÑ ÀÚ¹Ù½ºÅ©¸³Æ®¿Í °Ë»ö¿É¼Ç Åë°è¸¦ À§ÇÑ ½ºÅ©¸³Æ® ¸ðµÎ¸¦ ¾ø¾Ö¹ö·È°í, ȯ°æ°ú ¹«°üÇÏ°Ô ¸ðµç »ç¶÷ÀÌ °Ë»öÀ» »ç¿ëÇÒ ¼ö ÀÖµµ·Ï Çß´Ù.
¼³Á¤°ú ¹ø¿ªÀ» ¹Þ¾Æµé¿©¶ó
´ç½ÅÀÇ Äڵ带 À¯Áöº¸¼öÇϱ⠽±°Ô²û ÇÏ°í ¶ÇÇÑ °£°áÇÏ°Ô ¸¸µå´Â °¡Àå ¼º°øÀûÀÎ ÆÁ Áß Çϳª´Â, ½Ã°£ÀÌ È帧¿¡ µû¶ó º¯ÇÒ °ÍÀ¸·Î »ý°¢µÇ´Â ¸ðµç °ÍÀ» Æ÷ÇÔÇÏ´Â ¼³Á¤ °´Ã¼¸¦ ¸¸µé¾î µÎ¶ó´Â °ÍÀÌ´Ù. ÀÌ·¯ÇÑ ¼³Á¤ °´Ã¼¿¡´Â ´ç½ÅÀÌ ¸¸µé¾î³»´Â ¿ä¼Òµé¿¡ »ç¿ëµÉ ÅؽºÆ®(¹öÆ°ÀÇ °ª°ú À̹ÌÁö¸¦ À§ÇÑ ´ëüÅؽºÆ® ¿ª½Ã Æ÷ÇԵȴÙ), CSS Ŭ·¡½º, ID, ±×¸®°í ÀÎÅÍÆäÀ̽º¿¡¼ »ç¿ëÇÏ´Â ÀϹÝÀûÀÎ ¸Å°³º¯¼ö µîÀÌ Æ÷ÇԵȴÙ.
¿¹¸¦ µé¾î, Easy YouTube player ´Â ´ÙÀ½°ú °°Àº ¼³Á¤ °´Ã¼¸¦ Æ÷ÇÔÇÏ°í ÀÖ´Ù:
<ol style="padding-left: 2em; ">
ÀÌ°ÍÀ» ¸ðµâ ÆÐÅÏÀÇ ÀϺηΠÆ÷ÇÔ½ÃÅ°°í °ø°³ÇÑ´Ù¸é, ÀÌÇàÀÚµéÀÌ ´ç½ÅÀÇ ¸ðµâÀ» ÃʱâÈinitializeÇÏÁö ¾Ê°íµµ ÇÊ¿äÇÑ ºÎºÐ¸¸À» µ¤¾î ¾µ ¼ö ÀÖµµ·Ï ÇÒ ¼ö ÀÖÀ» °ÍÀÌ´Ù.
ÄÚµåÀÇ °ü¸®°¡ °£´ÜÇÏ°Ô²û ÇÏ´Â °ÍÀº Á¤¸»·Î Áß¿äÇÑ ÀÏÀÌ´Ù. ÀÌÈÄ ´ç½ÅÀÇ Äڵ带 ¼öÁ¤ÇÏ´Â »ç¶÷ÀÌ, ¼öÁ¤ÇÒ °÷À» ã±â À§ÇØ ÄÚµå Àüü¸¦ Àд ÀÏÀº ÇÇÇØ¾ß ÇÑ´Ù. ¸¸¾à ÀÌ°ÍÀÌ ºÐ¸íÇÏÁö ¾Ê´Ù¸é, ´ç½ÅÀÇ ÄÚµå´Â ¿ÏÀüÈ÷ °¥¾Æ¾þ¾îÁö°Å³ª, ¾Æ´Ï¸é ³µµÁú´çÇϰųª, µÑ Áß ÇϳªÀÌ´Ù. ÀÌ·¸°Ô ³µµÁú´çÇÑ ÄÚµå´Â ¾÷±×·¹À̵尡 ÇÊ¿äÇÑ ½ÃÁ¡¿¡¼ ¾÷±×·¹À̵带 ÇÒ ¼ö ¾ø°í, Àç»ç¿ë¼ºÀº »ç¶óÁø´Ù.
°úµµÇÑ ÁßøÀ» ÇÇÇضó
Äڵ带 ³×½ºÆÃÇÏ´Â °ÍÀº ±× ·ÎÁ÷À» ¼³¸íÇÏ°í, Àбâ ÆíÇÏ°Ô ¸¸µéÁö¸¸, ³Ê¹« °úÇÏ°Ô Áßø½ÃŲ´Ù¸é ´ç½ÅÀÌ ÇÏ°íÀÚ ÇÏ´Â °ÍÀ» µû¶ó°¡±â Èûµé°Ô ¸¸µç´Ù. Äڵ带 Àд »ç¶÷ÀÌ È¾½ºÅ©·ÑÀ» Çϰųª, ±×µéÀÇ ÄÚµå ¿¡µðÅÍ°¡ ±ä ÁÙÀ» ÀÚµ¿ ÁٹٲÞÇÏ°Ô²û ÇÏ´Â °Í(µé¿©¾²±â¿¡ µéÀÎ ´ç½ÅÀÇ ³ë·ÂÀº ¼öÆ÷·Î µ¹¾Æ°£´Ù)Àº ÇÇÇØ¾ß ÇÑ´Ù..
³×½ºÆÃÀÇ ´Ù¸¥ ¹®Á¦´Â º¯¼ö¸í°ú ·çÇÁÀÌ´Ù. ÀϹÝÀûÀ¸·Î ù¹ø° ·çÇÁ¸¦, Áõ°¡ ½Äº°ÀÚ·Î i¸¦ »ç¿ëÇÏ¿© ½ÃÀÛÇÏ°í, j, k, l ÇÏ´Â ½ÄÀ¸·Î ³×½ºÆýÃų °ÍÀÌ´Ù. ÀÌ·¸°Ô ÇÑ´Ù¸é ¼ø½Ä°£¿¡ Äڵ尡 ¸Á°¡Áö´Âµ¥, ÀÌ·¸°Ô:
<ol style="padding-left: 2em; ">
¹ü¿ëÀûÀÎ º¯¼ö¸í, ul °ú li ¸¦ »ç¿ëÇÏ°í Àֱ⠶§¹®¿¡, ³×½ºÆ®µÈ ¸ñ·Ï ¾ÆÀÌÅÛ¿¡ ´ëÇؼ nestedul°ú datali¸¦ ÇÊ¿ä·Î ÇÑ´Ù. ¸ñ·ÏÀÇ ³×½ºÆÃÀÌ ´õ ÇÊ¿äÇÏ´Ù¸é, ´õ ¸¹Àº º¯¼ö¸íÀÌ ÇÊ¿äÇÏ°í, ´õ ³×½ºÆÃÇÏ¸é ´õ ¸¹Àº º¯¼ö¸í, ´õ, ´õ. ÀÌ °æ¿ì, °¢°¢ÀÇ °´Ã¼¿¡ ´ëÇØ ³×½ºÆÃµÈ ¸ñ·ÏÀ» ¸¸µé¾î³»´Â ÀÛ¾÷À» º°µµÀÇ ÇÔ¼ö·Î ºÐ¸®ÇÏ°í, ÇÊ¿äÇÒ ¶§¿¡ È£ÃâÇÏ´Â °ÍÀÌ ÈξÀ ÇÕ¸®ÀûÀÌ´Ù. ÀÌ·¸°Ô ÇÑ´Ù¸é ¶ÇÇÑ ·çÇÁ ¼Ó¿¡ ¶Ç ·çÇÁ¸¦ ¸¸µå´Â ÀÏÀ» ÇÇÇÒ ¼ö ÀÖ´Ù. addMemberData() ÇÔ¼ö´Â ±ØÈ÷ ¹ü¿ëÀûÀ̸ç, ÇÊ¿äÇÒ ¶§ ¾Æ¹«¶§³ª »ç¿ëÇÒ ¼ö ÀÖ´Ù. ÀÌ·¯ÇÑ »ý°¢À» ½ÇÇà¿¡ ¿Å°Ü¼, Äڵ带 ´ÙÀ½°ú °°ÀÌ ÀçÀÛ¼ºÇÒ °ÍÀÌ´Ù:
<ol style="padding-left: 2em; ">
¹Ýº¹À» ÃÖÀûÈÇ϶ó
Á¤È®ÇÏ°Ô »ç¿ëÇÏÁö ¾Ê´Â´Ù¸é, ·çÇÁ´Â »ó´çÈ÷ ´À·ÁÁø´Ù. °¡Àå ¸¹ÀÌ ¹üÇÏ´Â ½Ç¼ö ÁßÀÇ Çϳª´Â, ¸Å ·çÇÁ¸¶´Ù ¹è¿ÀÇ ±æÀ̸¦ ´Ù½Ã ÀоîµéÀÌ´Â °ÍÀÌ´Ù:
<ol style="padding-left: 2em; ">
ÀÌ·¸°Ô ÇÑ´Ù¸é, ·çÇÁ°¡ µ¹ ¶§¸¶´Ù ÀÚ¹Ù½ºÅ©¸³Æ®´Â ¹è¿ÀÇ ±æÀ̸¦ Àоî¿Í¾ß ÇÑ´Ù. ¹è¿ÀÇ ±æÀ̸¦ º°µµÀÇ º¯¼ö¿¡ ÀúÀåÇÔÀ¸·Î¼ ÀÌ°ÍÀ» ÇÇÇÒ ¼ö ÀÖ´Ù:
<ol style="padding-left: 2em; ">
´õ ª°Ô ¾´´Ù¸é, ·çÇÁ ¾ÕÀÇ ¼±¾ð¿¡¼ µÎ¹ø° º¯¼ö¸¦ ¸¸µé¾î³»´Â ¹æ¹ýÀÌ ÀÖ´Ù:
<ol style="padding-left: 2em; ">
ÇÑ°¡Áö ´õ È®½ÇÈ÷ ÇØ¾ß ÇÏ´Â °ÍÀº, º¹ÀâÇÑ °è»êÀº ·çÇÁ ¹Û¿¡¼ ó¸®ÇÑ´Ù´Â °ÍÀÌ´Ù. ÀÌ°ÍÀº Á¤±Ô½Ä – ±×¸®°í ´õ Áß¿äÇÑ °ÍÀº – DOM Á¶ÀÛÀ» Æ÷ÇÔÇÑ´Ù. DOM ³ëµå »ý¼ºÀº ·çÇÁ ¾È¿¡¼ ÇÒ ¼ö ÀÖÁö¸¸, ¹®¼¿¡ »ðÀÔÇÏ´Â °ÍÀº »ï°¡Çϴ°ÍÀÌ ÁÁ´Ù. DOM¿¡ °üÇÑ Áß¿äÇÑ ±ÔÄ¢Àº ´ÙÀ½ ¼½¼Ç¿¡¼ º¼ ¼ö ÀÖ´Ù.
DOM Á¢±ÙÀ» ÃÖ¼ÒÈÇ϶ó
ºê¶ó¿ìÀú¿¡¼ DOM¿¡ Á¢±ÙÇÏ´Â °ÍÀº »ó´çÇÑ ºñ¿ëÀ» ¼Ò¸ðÇÏ´Â ÀÏÀÌ´Ù. DOMÀº ´ë´ÜÈ÷ º¹ÀâÇÑ APIÀÌ°í, ºê¶ó¿ìÀú¿¡¼ Ç¥ÇöÇÒ ¶§ ¸¹Àº ½Ã°£À» ¼Ò¸ðÇÒ ¼ö ÀÖ´Ù. ´ç½ÅÀÇ ÄÄÇ»ÅÍ°¡ ÀÌ¹Ì ¹«¾ð°¡¸¦ ÇÏ¸é¼ ´ëºÎºÐÀÇ ÀÚ¿øÀ» ¼Ò¸ðÇÑ »óÅ¿¡¼ º¹ÀâÇÑ À¥ ÀÀ¿ëÇÁ·Î±×·¥À» ½ÇÇà½ÃÄÑ º¸¶ó – º¯È°¡ ´Ê°Ô ¹Ý¿µµÇ°Å³ª, Àý¹Ý¸¸ º¸¿©Áö°Å³ª ÇÒ °ÍÀÌ´Ù.
´ç½ÅÀÇ Äڵ尡 ¼Óµµ¸¦ À¯ÁöÇÏ°í, ºê¶ó¿ìÀú¸¦ ´À¸®°Ô ÇÏÁö ¾Ê±â À§Çؼ, DOM Á¢±ÙÀ» ÇÒ ¼ö ÀÖ´Â ÃÖ¼ÒÇÑÀ¸·Î ÁÙ¿©¶ó. °è¼ÓÇؼ ¿ä¼Ò¸¦ ¸¸µé°í Àû¿ëÇØ´ë´Â ´ë½Å, ¹®ÀÚ¿À» DOM ¿ä¼Ò·Î ¹Ù²Ù´Â ÇÔ¼ö¸¦ ¸¸µç µÚ, ÀÌ ÇÔ¼ö¸¦ ¸¶Áö¸·¿¡ È£ÃâÇÔÀ¸·Î¼, ºê¶ó¿ìÀú°¡ ȸéÀ» Ç¥ÇöÇÏ´Â °úÁ¤À» ¿©·¯¹ø ¹æÇØÇÏÁö ¸»°í Çѹø¿¡ ³¡³»µµ·Ï Ç϶ó.
ºê¶ó¿ìÀúÀÇ º¯´ö¿¡ ±¼º¹ÇÏÁö ¸»¶ó
ƯÁ¤ ºê¶ó¿ìÀú¿¡ ±â¹ÝÇÏ´Â Äڵ带 ¾²´Â °ÍÀº, ´ç½ÅÀÇ Äڵ带 °ü¸®ÇϱⰡ ¾î·Æ°Ô µÇ°í, ¾ÆÁÖ »¡¸® ³°¾Æ¹ö¸®°Ô ÇÏ´Â ÀÏÀÌ´Ù. ºÒº¸µí »·ÇÏ´Ù. À¥À» µ¹¾Æº»´Ù¸é, ¾ÆÁÖ ¸¹Àº ¼ýÀÚÀÇ ½ºÅ©¸³Æ®°¡ ƯÁ¤ ºê¶ó¿ìÀú¸¦ °¡Á¤ÇÏ¿© ¸¸µé¾îÁ³°í, »õ·Î¿î ¹öÀüÀÌ ³ª¿À°Å³ª ´Ù¸¥ ºê¶ó¿ìÀú¿¡¼ ½ÇÇàÇÒ ¶§ Áï½Ã ½ÇÇàÀ» ¸ØÃç¹ö¸®´Â °ÍÀ» ¹ß°ßÇÏ°Ô µÉ °ÍÀÌ´Ù.
½Ã°£°ú ³ë·ÂÀÇ ³¶ºñÀÌ´Ù. ¿ì¸®°¡ ÁøÇàÇÏ°í ÀÖ´Â °úÁ¤¿¡¼ °³¿ä¸¦ ¼³¸íÇÏ°í ÀÖ´Â, Ç¥ÁØ¿¡ ±â¹ÝÇؼ Äڵ带 ÀÛ¼ºÇØ¾ß ÇÑ´Ù. À¥Àº ¸ðµÎ¸¦ À§ÇÑ °ÍÀ̸ç, ¼³Á¤ÇÏ´Â ÀÏ¿¡ ´É¼÷ÇÑ ¼Ò¼ö ¿¤¸®Æ®¸¦ À§ÇÑ °ÍÀÌ ¾Æ´Ï´Ù. ºê¶ó¿ìÀú ½ÃÀåÀº ±Þº¯ÇϹǷÎ, (ƯÁ¤ ºê¶ó¿ìÀú¸¦ À§ÇÑ Äڵ带 ÀÛ¼ºÇß´Ù¸é) °è¼ÓÇؼ Äڵ带 ¼öÁ¤ÇØ¾ß ÇÒ °ÍÀÌ´Ù. ÀÌ°ÍÀº Àç¹ÌÀÖÁöµµ, È¿À²ÀûÀÌÁöµµ ¾Ê´Ù.
¸¸¾à ¾î¶² ¸¶¹ý°°Àº Äڵ带 ÀÛ¼ºÇߴµ¥ ÀÌ°ÍÀÌ Æ¯Á¤ ºê¶ó¿ìÀú¿¡¼¸¸ µ¿ÀÛÇÏ°í, °Ô´Ù°¡ ´ç½ÅÀÌ Á¤¸»·Î ±×°ÍÀ» ÇÊ¿ä·Î ÇÑ´Ù¸é, ±× ½ºÅ©¸³Æ®¸¦ µû·Î ºÐ¸®Çس»°í ºê¶ó¿ìÀú À̸§°ú ¹öÀüÀ» »ç¿ëÇؼ ¸í¸íÇÏ´Â °ÍÀÌ ÁÁ´Ù. ÀÌ·¸°Ô ÇÔÀ¸·Î¼, ¾ðÁ¨°¡ ±× ºê¶ó¿ìÀú¸¦ »ç¿ëÇÒ ¼ö ¾ø°Ô µÉ °æ¿ì ±× ±â´ÉÀ» ½±°í ºü¸£°Ô Á¦°ÅÇÒ ¼ö ÀÖ´Ù.
¾î¶² µ¥ÀÌÅ͵µ ½Å·ÚÇÏÁö ¸»¾Æ¶ó
ÄÚµå¿Í µ¥ÀÌÅÍÀÇ º¸¾È¿¡ ´ëÇØ, Ç×»ó ¿°µÎ¿¡ µÎ¾î¾ß ÇÒ ¿äÁ¡Àº ¾î¶°ÇÑ µ¥ÀÌÅ͵µ ½Å·ÚÇؼ± ¾ÈµÈ´Ù´Â °ÍÀÌ´Ù. ´ç½ÅÀÇ ½Ã½ºÅÛÀ» ÇØÅ·ÇÏ°íÀÚ ÇÏ´Â ¾ÇÀÇÀûÀÎ »ç¿ëÀÚ¸¸À» ¸»ÇÏ´Â °ÍÀÌ ¾Æ´Ï´Ù : ÀÌ°ÍÀº Æò¹üÇÑ »ç¿ë¼º¿¡¼ Ãâ¹ßÇÏ´Â À̾߱âÀÌ´Ù. »ç¿ëÀÚ´Â ºÎÁ¤È®ÇÑ µ¥ÀÌÅ͸¦ ÀÔ·ÂÇÑ´Ù. ÀÌ°ÍÀº ºÒº¯ÀÇ »ç½ÇÀÌ´Ù. ±×µéÀÌ ¸ÛûÇؼ°¡ ¾Æ´Ï¶ó, ±×µéÀÌ ¹Ù»Ú°í, ´Ù¸¥ ÀÏ¿¡ ÁÖÀǸ¦ ºÐ»êÇØ¾ß ÇÏ°í, ȤÀº ´ç½ÅÀÇ ¼³¸íÀÌ ±×µéÀ» È¥¶õ½ÃÄ×À» ¼öµµ ÀÖ´Ù. ¿¹¸¦ µé¾î, ³ª´Â Áö±Ý ¸· È£ÅÚÀ» ¿¹¾àÇߴµ¥, ¼ýÀÚ¸¦ À߸ø ÀÔ·ÂÇÏ´Â ¹Ù¶÷¿¡ 6ÀÏÀÌ ¾Æ´Ñ 1°³¿ùÀ» ¿¹¾àÇØ ¹ö·È´Ù¡¦ ³ ³»°¡ »ó´çÈ÷ ¿µ¸®ÇÏ´Ù°í ¹Ï°í Àִµ¥ ¸»ÀÌ´Ù.
¿ä¾àÇÏÀÚ¸é, ´ç½ÅÀÇ ½Ã½ºÅÛÀ¸·Î Àü¼ÛµÇ´Â ¸ðµç µ¥ÀÌÅÍ´Â ±ò²ûÇØ¾ß ÇÏ°í, Á¤È®È÷ ´ç½ÅÀÌ ¿øÇÏ´Â °ÍÀ̾î¾ß ÇÑ´Ù. ƯÈ÷, ¼¹ö¿¡¼ Àü¼Û¹ÞÀº URLÀÇ ÀϺθ¦ Ãß·Á³»¼ ¸Å°³º¯¼ö·Î »ç¿ëÇÏ´Â °æ¿ì¿¡ ÀÌ°ÍÀº Á¤¸» Áß¿äÇÏ´Ù. ÀÚ¹Ù½ºÅ©¸³Æ®¿¡¼´Â, ÇÔ¼ö·Î º¸³»¾îÁö´Â ¸Å°³º¯¼öµéÀÇ Å¸ÀÔÀ» üũ(typeof Å°¿öµå¸¦ ÀÌ¿ëÇؼ)Çغ¸´Â °ÍÀÌ ¾ÆÁÖ Áß¿äÇÏ´Ù. À̾îÁö´Â ¿¹Á¦´Â, ¸¸¾à members°¡ ¹è¿ÀÌ ¾Æ´Ñ °æ¿ì(¿¹¸¦ µéÀÚ¸é, ¹è¿ÀÌ ¾Æ´Ñ ¹®ÀÚ¿ÀÌ ÀԷµǾúÀ» °æ¿ì ¹®ÀÚ¿ÀÇ °¢ ¹®ÀÚ¸¦ ³ª¿ÇÏ´Â ¸ñ·ÏÀ» ¸¸µé °ÍÀÌ´Ù)¿¡´Â ¿¡·¯ÀÌ´Ù:
<ol style="padding-left: 2em; ">
ÀÌ°ÍÀÌ ÀÛµ¿ÇÏ°Ô²û Çϱâ À§ÇØ, members ÀÇ Å¸ÀÔÀ» üũÇؼ ±×°ÍÀÌ ¹è¿ÀÎÁö È®ÀÎÇØ¾ß ÇÑ´Ù:
<ol style="padding-left: 2em; ">
¹è¿Àº Á» È¥µ¿½º·¯¿îµ¥, ÀÚ½ÅÀÇ Å¸ÀÔÀ» °´Ã¼¶ó°í ¹ÝȯÇϱ⠶§¹®ÀÌ´Ù. ¹è¿ÀÓÀ» È®ÀÎÇϱâ À§Çؼ, ¹è¿¸¸ÀÌ °¡Áö°í ÀÖ´Â ¸Þ¼µå·Î üũÇغ¸¸é µÈ´Ù.
º¸¾È¿¡¼ °Å¸®°¡ ¸Õ ´Ù¸¥ Çϳª´Â, DOM ¿¡¼ Á¤º¸¸¦ ÀÐ°í ±×°ÍÀ» ºñ±³Çغ¸´Â ÀÏ ¾øÀÌ »ç¿ëÇÏ´Â °ÍÀÌ´Ù. ¿¹¸¦ µé¾î, ³ª´Â ÀÚ¹Ù½ºÅ©¸³Æ® ±â´ÉÀ» ¸ØÃß°Ô ÇÑ Äڵ带 µð¹ö±×Çغ» ÀûÀÌ ÀÖ¾ú´Ù. Äڵ尡 ¿¡·¯¸¦ ¸¸µç ÀÌÀ¯-³ª¿Í´Â °ü°è°¡ ¾ø¾ú´Âµ¥-´Â »ç¿ëÀÚ À̸§À» ÆäÀÌÁö ¿ä¼ÒÀÇ innerHTML ¿¡¼ Àо°í´Â ±×°ÍÀ» ¸Å°³º¯¼ö »ï¾Æ¼ ÇÔ¼ö¸¦ È£ÃâÇÑ °ÍÀÌ´Ù. »ç¿ëÀÚ À̸§Àº UTF-8 ¹®ÀÚ¼ÂÀÇ ¾î¶² ¹®ÀÚ¶óµµ ¿Ã ¼ö Àִµ¥, ÀÌ°ÍÀº Å«µû¿ÈÇ¥¿Í ÀÛÀºµû¿ÈÇ¥ ¿ª½Ã Çã¿ëµÈ´Ù´Â ¶æÀÌ´Ù. ÀÌ·¯ÇÑ ¹®ÀÚ°¡ »ðÀÔµÊÀ¸·Î¼ ¹®ÀÚ¿Àº Á¾·áµÉ °ÍÀÌ°í, ±× µÚ¿¡ µû¶ó¿À´Â ³ª¸ÓÁö´Â ¿¡·¯¸¦ ¸¸µé¾î³»´Â µ¥ÀÌÅÍ°¡ µÈ´Ù. Ãß°¡ÇÏÀÚ¸é, FireBug ³ª Opera Dragonfly °°Àº ÅøÀ» ÀÌ¿ëÇؼ HTMLÀ» º¯°æÇÒ ÁÙ ¾Æ´Â »ç¿ëÀÚ´Â »ç¿ëÀÚ À̸§À» ¾î¶² °ÍÀ¸·Îµç º¯°æÇÒ ¼ö ÀÖ°í, ´ç½ÅÀÇ ÇÔ¼ö¿¡ ¹«¾ùÀÌ¶óµµ ÁÖÀÔÇÒ ¼ö ÀÖ´Ù
À¯È¿¼º °ËÁõÀ» Ŭ¶óÀ̾ðÆ®»çÀ̵忡¼¸¸ ¼öÇàÇÏ´Â ÀԷ¾ç½Äµé¿¡¼ °°Àº ÀÏÀÌ ¹ú¾îÁú ¼ö ÀÖ´Ù. ³ ÀÌÀü¿¡ »ç¿ëÇÒ ¼ö ¾ø´Â À̸ÞÀÏ ÁÖ¼Ò¿¡ µî·ÏÇÑ ÀÏÀÌ ÀÖ¾ú´Âµ¥, ´Ù¸¥ ¿É¼ÇÀ» Á¦°øÇÏ´Â ¼±ÅÃÀ» ´Ù½Ã ½á¹ö·È±â ¶§¹®ÀÌ´Ù. ÀԷ¾ç½ÄÀº ¼¹ö¿¡¼ °ËÁõµÇÁö ¾Ê¾Ò°í, ¿¡·¯¸¦ ³»Áö ¾ÊÀº ä ÁøÇàµÇ¾î¹ö·È´Ù.
DOM °ú ¿¬µ¿ÇÒ °æ¿ì, Á¢±ÙÇؼ º¯°æÇÏ°íÀÚ ÇÏ´Â ¿ä¼Ò°¡ ½ÇÁ¦·Î Á¸ÀçÇÏ´ÂÁö, ±×¸®°í ±× ¿ä¼Ò°¡ ¾î¶² ¿ä¼ÒÀÌ±æ ±â´ëÇÏ´ÂÁö Á¡°ËÇϵµ·Ï Ç϶ó. ±×·¸Áö ¾ÊÀ¸¸é, ´ç½ÅÀÇ ÄÚµå´Â µ¿ÀÛÇÏÁö ¾Ê°Å³ª ȸéÀ» ÀÌ»óÇÏ°Ô Ç¥ÇöÇÏ´Â ¹ö±×¸¦ ÃÊ·¡ÇÒ °ÍÀÌ´Ù.
ÀÚ¹Ù½ºÅ©¸³Æ®·Î ±â´ÉÀ» Ãß°¡ÇϵÇ, ³Ê¹« ¸¹Àº ³»¿ëÀ» Ãß°¡ÇÏÁö´Â ¸»¾Æ¶ó
´Ù¸¥ ¿¹Á¦µé¿¡¼ ºÁ ¿Ô°ÚÁö¸¸, ÀÚ¹Ù½ºÅ©¸³Æ®¸¦ ÀÌ¿ëÇؼ ¹æ´ëÇÑ ¾çÀÇ HTMLÀ» ±¸ÃàÇÏ´Â °ÍÀº ¸Å¿ì ºÒ¾ÈÇÏ°í, ¸ÁÃÄÁö±â ½¬¿î ÀÛ¾÷ÀÌ´Ù. ƯÈ÷ IE¿¡¼, ±×°ÍÀÌ ¾ÆÁ÷ ÆäÀÌÁö¸¦ ·ÎµùÁßÀ϶§ innerHTML À» ÀÌ¿ëÇؼ ¹®¼¸¦ ¼öÁ¤ÇÏ°í Á¶ÀÛÇÏ´Â °ÍÀº ¿Â°® Á¾·ùÀÇ °ñÄ©°Å¸®µé·Î ½º½º·Î ¶Ù¾îµå´Â °ÍÀÌ´Ù(ÀÌ·¯ÇÑ ºñÂüÇÔ°ú ºñÅëÇÔÀÇ À̾߱⸦ º¸°í ½Í´Ù¸é, Google¿¡¼ ¡°operation aborted error¡±¸¦ °Ë»öÇغ¸¸é µÈ´Ù).
ÆäÀÌÁö °ü¸®¶ó´Â °üÁ¡¿¡¼ º»´Ù Çصµ, ´ë·®ÀÇ ¸¶Å©¾÷À» ÀÚ¹Ù½ºÅ©¸³Æ®·Î ÇÏ´Â °ÍÀº ²ûÂïÇÑ ¹ß»óÀÌ´Ù. ¸ðµç °ü¸®ÀÚ°¡ ´ç½Å°ú °°Àº ¼öÁØÀÇ ±â¼úÀ» °¡Áø °ÍÀÌ ¾Æ´Ï¸ç, ´ç½ÅÀÇ Äڵ带 ¿ÏÀüÈ÷ ¸ÁÃÄ ³õÀ» °¡´É¼ºÀÌ ÀÖ´Ù.
³»°¡ ÀÚ¹Ù½ºÅ©¸³Æ®¿¡ ´ë´ÜÈ÷ ÀÇÁ¸ÀûÀÎ ÇÁ·Î±×·¥À» °³¹ßÇØ¾ß Çß¾úÀ» ¶§, HTML ÅÛÇø´À» ¹Ì¸® ¸¸µé¾îµÎ°í ÀÌ ÅÛÇø´À» Ajax·Î ºÒ·¯¿À´Â°ÍÀÌ ÈξÀ ÇÕ¸®ÀûÀÎ °ÍÀ» ¹ß°ßÇß´Ù. ÀÌ·¸°Ô Çϸé, °ü¸®ÀÚµéÀÌ HTML ±¸Á¶¿Í, ¹«¾ùº¸´Ùµµ Áß¿äÇÑ, ÅؽºÆ®(³»¿ë)¸¦ ´ç½ÅÀÇ ÀÚ¹Ù½ºÅ©¸³Æ® ÄÚµå¿Í Ãæµ¹ÇÏ´Â ÀÏ ¾øÀÌ ¼öÁ¤ÇÒ ¼ö ÀÖ´Ù. ÇÊ¿äÇÑ °ÍÀº, ±×µé¿¡°Ô ¾î¶² ID ¼Ó¼ºµéÀÌ ÇÊ¿äÇÑ °ÍÀ̸ç, ¹Ýµå½Ã ±× ¼ø¼´ë·Î ÀÖ¾î¾ß ÇÏ´Â HTML ±¸Á¶¿¡ ´ëÇؼ ÀÏ·¯µÎ´Â °Í »ÓÀÌ´Ù. ÀÌ·¯ÇÑ ¼³¸íÀº HTML ³»ºÎ ÁÖ¼®À» ÅëÇؼ ÇÒ ¼ö ÀÖ´Ù(±×¸®°í ±× ÅÛÇø´À» ½ÇÁ¦·Î ·ÎµùÇÒ¶§´Â ÁÖ¼®À» ¾ø¾Ø´Ù. the Easy YouTube templateÀÇ ¼Ò½º¸¦ Âü°íÇؼ ¿¹Á¦·Î »ïÀ¸¸é µÉ °ÍÀÌ´Ù).
¾Æ·¡ÀÇ ½ºÅ©¸³Æ®¿¡¼´Â, Á¤È®ÇÑ HTML ÄÁÅ×À̳ʰ¡ ÀÖÀ»¶§ ÅÛÇø´À» ºÒ·¯¿À°í, ±× ÈÄ¿¡ setupPlayer() ¸Þ¼µå¿¡ ÀÖ´Â À̺¥Æ® Çڵ鷯µéÀ» ÇÒ´çÇÑ´Ù:
<ol style="padding-left: 2em; ">
ÀÌ·¸°Ô ÇÔÀ¸·Î¼, »ç¶÷µéÀº ÀÚ¹Ù½ºÅ©¸³Æ® Äڵ带 º¯°æÇÒ ÇÊ¿ä ¾øÀÌ Ç÷¹À̾ ÀÚ±¹¾î·Î ¹ø¿ªÇÏ°í, ±×µéÀÌ ¿øÇÏ´Â ¹æ½ÄÀ¸·Î ¹Ù²Ü ¼ö ÀÖ´Ù.
°ÅÀÎÀÇ ¾î±ú À§¿¡¼ ÀÏÇ϶ó
Áö³ ¼ö³â°£, ÀÚ¹Ù½ºÅ©¸³Æ® ¶óÀ̺귯¸®µé°ú ÇÁ·¹ÀÓ¿öÅ©µéÀÌ À¥ °³¹ß ½ÃÀåÀ» Áö¹èÇϱ⠽ÃÀÛÇÏ°Ô µÈ °Í¿¡´Â ¾î¶°ÇÑ ¹Ý´ëµµ ¾ø¾ú´Ù. ±×¸®°í ÀÌ°ÍÀº °áÄÚ ³ª»Û °ÍÀÌ ¾Æ´Ï´Ù – Á¤È®È÷ »ç¿ëÇÑ´Ù¸é ¸»ÀÌ´Ù. ÁÁÀº ÀÚ¹Ù½ºÅ©¸³Æ® ¶óÀ̺귯¸®µéÀº ÇÑ°¡Áö ÀÏÀ» ÇÏ°í, ±× ÇÑ°¡Áö Àϸ¸ ÇÑ´Ù: ºê¶ó¿ìÀú°£ ºñȣȯ¼ºÀ» ¸Þ²Ù°í ºê¶ó¿ìÀú Áö¿ø¿¡ ¶Õ¸° ±¸¸ÛÀ» ¸Þ¿öÁÜÀ¸·Î¼ °³¹ßÀڷμÀÇ ´ç½ÅÀÇ »îÀ» Æí¾ÈÇÏ°Ô ÇØÁØ´Ù. ÀÌ·¯ÇÑ ¶óÀ̺귯¸®µéÀº ¿¹Ãø °¡´ÉÇÏ°í ±â´ÉÀûÀÎ ±â¹ÝÀ» Á¦°øÇÑ´Ù.
óÀ½ ¹è¿ï¶§´Â ¶óÀ̺귯¸® ¾øÀÌ Çغ¸´Â °ÍÀÌ ÁÁÀºµ¥, ¾î¶² ÀÏÀÌ ÀϾ°í ÀÖÀ¸¸ç ¹«¾ùÀÌ ¹®Á¦ÀÎÁö ¾Ë ¼ö Àֱ⠶§¹®ÀÌ´Ù. ÇÏÁö¸¸ À¥ »çÀÌÆ® °³¹ßÀ» ½ÇÁ¦·Î ½ÃÀÛÇÑ ÈÄ¿¡´Â ¶óÀ̺귯¸®¸¦ ¾²´Â °ÍÀÌ ÁÁ´Ù. Á÷Á¢ ó¸®ÇØ¾ß ÇÒ ¹®Á¦µéÀÇ ¼ýÀÚ°¡ ÁÙ¾îµé°í, ¹ö±×ÀÇ ¹üÀ§¸¦ ÇÑÁ¤ÁöÀ» ¼ö ÀÖ´Ù – ¿¹ÃøÇϱâ Èûµç ºê¶ó¿ìÀú ¹®Á¦°¡ ¾Æ´Ï´Ù.
³»°¡ °³ÀÎÀûÀ¸·Î ÁÁ¾ÆÇÏ´Â °ÍÀº the Yahoo User Interface library (YUI) À̸ç, jQuery, Dojo,Prototype µéµµ ±¦Âú´Ù. ÇÏÁö¸¸ ±×¹Û¿¡µµ ¼ö¸¹Àº ÁÁÀº ¶óÀ̺귯¸®µéÀÌ ÀÖÀ¸¹Ç·Î, ´ç½Å¿¡°Ô ¸Â°í ´ç½ÅÀÌ ÇÏ´Â ÀÏÀ» °¡Àå Àß µµ¿ÍÁÙ °ÍÀ» ã¾Æ¾ß ÇÒ °ÍÀÌ´Ù.
¶óÀ̺귯¸® »çÀÌÀÇ Ãæµ¹µµ ÀÖÀ¸¹Ç·Î, ÇϳªÀÇ ÇÁ·ÎÁ§Æ®¿¡ ¿©·¯°³ÀÇ ¶óÀ̺귯¸®¸¦ »ç¿ëÇÏ´Â °ÍÀº ÁÁÁö ¾Ê´Ù. ÀÌ·¸°Ô ÇÏ°Ô µÇ¸é ¶Ç´Ù¸¥ ºÒÇÊ¿äÇÑ º¹ÀâÇÔ°ú °ü¸®ÀÇ ¹®Á¦¸¦ ³º°Ô µÉ °ÍÀÌ´Ù.
°³¹ß ÄÚµå¿Í ½ÇÁ¦ ÄÚµå´Â ´Ù¸£´Ù
¸¶Áö¸·À¸·Î ¸»ÇÏ°í ½ÍÀº °ÍÀº ÀÚ¹Ù½ºÅ©¸³Æ® ÀÚü¿¡ °üÇÑ À̾߱â´Â ¾Æ´Ï¸ç, ÀÌÈÄ ´ç½ÅÀÇ °³¹ß ¹æÇâ Àüü¿Í °ü·ÃµÈ À̾߱âÀÌ´Ù. ÀÚ¹Ù½ºÅ©¸³Æ®¿¡ °¡ÇÏ´Â ¾à°£ÀÇ ¼öÁ¤À¸·Îµµ À¥ ÇÁ·Î±×·¥ÀÇ ¼º´É°ú ±â´É¼º¿¡ Áï°¢ÀûÀÎ º¯È¸¦ °¡Á®¿À¹Ç·Î, °ü¸®ÀÇ ÆíÀǼºÀº Á¦²¸µÎ°í ÇÒ ¼ö Àִ¸¸Å Äڵ带 ÃÖÀûÈÇÏ°í ½ÍÀº ½ÉÇÑ À¯È¤À» ´À³¢°Ô µÉ °ÍÀÌ´Ù.
ÀÚ¹Ù½ºÅ©¸³Æ®ÀÇ ¼º´ÉÀ» ±ØÀûÀ¸·Î ²ø¾î¿Ã¸± ¼ö ÀÖ´Â ²Ï ±¦ÂúÀº Æ®¸¯µéÀÌ ¸¹ÀÌ ÀÖ´Ù. ±×µé Áß ´ëºÎºÐÀº, Äڵ带 ÀÌÇØÇÏ°í °ü¸®Çϱ⠾î·Æ°Ô µÈ´Ù´Â ´ÜÁ¡À» °¡Áö°í ÀÖ´Ù.
¾ÈÀüÇÏ°í, Àß µ¿ÀÛÇÏ´Â ÀÚ¹Ù½ºÅ©¸³Æ®¸¦ ÀÛ¼ºÇϱâ À§ÇØ, ¿ì¸®´Â ÀÌ·¯ÇÑ ¼øȯÀ» ²÷°í, µ¿·á °³¹ßÀÚ°¡ ¾Æ´Ï¶ó ÄÄÇ»Å͸¦ À§ÇØ Äڵ带 ÃÖÀûÈÇÏ´Â ½À°üÀ» ¹ö·Á¾ß ÇÑ´Ù. ´Ù¸¥ ¾ð¾îµé¿¡¼´Â ¾ÆÁÖ ÈçÇÑ ÀÏÀÌÁö¸¸ ÀÚ¹Ù½ºÅ©¸³Æ® ÇÁ·Î±×·¡¸Óµé »çÀÌ¿¡¼´Â ¾ÆÁ÷ ¸¹ÀÌ ¾Ë·ÁÁöÁö ¾ÊÀº °ÍÀÌ´Ù. ¿Ï¼ºµÈ ½ºÅ©¸³Æ®¿¡¼´Â °ø¹éÀ» Áö¿ì°í, ÁÖ¼®À» ¾ø¾Ö°í, ¹è¿ ÂüÁ¶¸¦ ÅëÇØ ¹®ÀÚ¿À» ġȯÇÏ°í(IE°¡ ¸ðµç ¹®ÀÚ¿¿¡ ´ëÇØ ¹®ÀÚ¿ °´Ã¼¸¦ ¸¸µå´Â – ½ÉÁö¾î Á¶°ÇÀý¿¡¼µµ – °ÍÀ» ¹æÁöÇϱâ À§ÇØ), ºê¶ó¿ìÀú¿¡¼ ÀÚ¹Ù½ºÅ©¸³Æ®°¡ ³¯¾Æ´Ù´Ï°Ô ÇÒ ¼ö ÀÖ´Â ¸ðµç ÀÛÀº Æ©´×µéÀ» ÇàÇضó.
óÀ½ÀÇ Äڵ尡 ÀÌÇØÇϱ⠽±°í, ´Ù¸¥ °³¹ßÀÚµéÀÌ È®ÀåÇϱ⠽±°Ô²û ¸¸µå´Âµ¥ ÁýÁßÇÑ´Ù¸é, ¿Ïº®ÇÑ ½ºÅ©¸³Æ®¸¦ ¸¸µé¼ö ÀÖÀ» °ÍÀÌ´Ù. Á¶±ÞÇÏ°Ô ÃÖÀûÈÇÏ´Â °ÍÀ» ¹Ýº¹ÇÑ´Ù¸é °áÄÚ ±×·¸°Ô µÉ ¼ö ¾ø´Ù. ´ç½Å ÀÚ½ÅÀ» À§ÇØ, ȤÀº ºê¶ó¿ìÀú¸¦ À§ÇØ °³¹ßÇÏÁö ¸»¾Æ¶ó – ´ç½Å¿¡°Ô¼ ÀÛ¾÷À» ³Ñ°Ü¹ÞÀ» ´ÙÀ½ °³¹ßÀÚ¸¦ À§ÇØ ÀÛ¾÷Çضó.
¿ä¾à
ÀÚ¹Ù½ºÅ©¸³Æ®¿¡¼ ÁÖµÈ ¿ä·ÉÀº ½¬¿î ±æÀ» ÇÇÇÏ´Â °ÍÀÌ´Ù. ÀÚ¹Ù½ºÅ©¸³Æ®´Â ½Ç·Î À¶Å뼺ÀÖ´Â ¾ð¾îÀÌ°í, °³¹ß ȯ°æÀ¸·Î¼ ´ë´ÜÈ÷ ³Ê±×·¯¿î ÆíÀÌ´Ù – ±×·¸±â ¶§¹®¿¡, ¹®Á¦¸¦ ÇØ°áÇÏ´Â °Í ó·³ º¸ÀÌ´Â Çã¼úÇÑ Äڵ带 ¸¸µé¾î³»±â ½±´Ù. ±×·¸Áö¸¸ ÀÌ Çã¼úÇÑ ÄÚµå´Â ¸î ´Þ µÚ¿¡ µ¹¾Æ¿Í¼ ´ç½ÅÀ» ¹°¾î¶âÀ» °ÍÀÌ´Ù.
´ç½ÅÀÌ À¥ °³¹ßÀÚ Á÷¾÷À» °¡Á®¾ß ÇÑ´Ù¸é, ÀÚ¹Ù½ºÅ©¸³Æ® °³¹ßÀº ÁÖº¯(¿ªÁÖ:ÇÙ½ÉÀÌ ¾Æ´Ï¶ó´Â Àǹ̷Î) Áö½ÄÀÇ ¿µ¿ª¿¡¼ Àý´ëÀûÀÎ Çʿ伺À¸·Î º¯½ÅÇÑ´Ù. Áö±Ý ¹Ù·Î ½ÃÀÛÇÑ´Ù¸é ¿îÀÌ ÁÁÀº ÆíÀε¥, ³ª¸¦ ºñ·ÔÇÑ ¸¹Àº »ç¶÷µéÀÌ ÀÌ¹Ì ¼ö¸¹Àº ½Ç¼öµéÀ» ÀúÁú·¶°í ÀÌ·¯ÇÑ ½ÃÇàÂø¿À¸¦ ÅëÇØ ¹è¿ö¿Ô±â ¶§¹®ÀÌ´Ù. ¿ì¸®´Â ÀÌ·¯ÇÑ Áö½ÄÀ» ¾Ë·ÁÁÙ ¼ö ÀÖ´Ù..
ÀúÀÚ¿¡ °üÇÏ¿©
Chris HeilmannÀº Áö³ 10³â°£ À¥ °³¹ßÀڷμ È°µ¿ÇØ ¿ÔÀ¸¸ç Ãë¹Ì»ï¾Æ ¶óµð¿À Àú³Î¸®Áò¿¡ °üÇÑ Àϵµ ÇÑ´Ù. ±×´Â ¿µ±¹¿¡ ÀÖ´Â ¾ßÈÄ¿¡¼ Æ®·¹ÀÌ³Ê¿Í ¸®´õ °³¹ßÀÚ·Î ±Ù¹«ÇÏ°í ÀÖÀ¸¸ç À¯·´°ú ¾Æ½Ã¾ÆÀÇ front end ÄÚµåÀÇ Ç°ÁúÀ» °ü¸®ÇÑ´Ù.
±×ÀÇ ºí·Î±×´Â Wait till I come ¿¡ ÀÖÀ¸¸ç ¸¹Àº ¼Ò¼È ³×Æ®¿öÅ©¿¡¼ ¡°codepo8¡±·Î ¾Ë·ÁÁ® ÀÖ´Ù.
- ¿ªÁÖ : °á°úÀûÀ¸·Î <input class=¡¯mandatory error¡¯> ¶ó´Â ¿ä¼Ò°¡ ¸¸µé¾îÁö´Âµ¥, ÀÌ°ÍÀÌCSS ±ÔÄ¢¿¡ ºÎÇÕÇÏ´Â ¿Ã¹Ù¸¥ ¼±ÅÃÀÚÀ̱ä ÇÏÁö¸¸ ÀϺΠºê¶ó¿ìÀú¿¡¼´Â ÀÌ·¯ÇÑ ÇüÅÂÀÇ ´ÙÁß ¼±ÅÃÀÚ¸¦ Áö¿øÇÏÁö ¾Ê°í ÀÖ´Ù.
Ãâó: http://dotweb.tistory.com/86 [Àý´ë·Î °í°³¸¦ ¶³±¸Áö ¸»¶ó. °í°³¸¦ Ä¡Äѵé°í ¼¼»óÀ» ¶È¹Ù·Î ¹Ù¶óº¸¶ó.]