{"id":2385,"date":"2016-06-28T06:17:38","date_gmt":"2016-06-28T06:17:38","guid":{"rendered":"http:\/\/www.gisdeveloper.co.kr\/?p=2385"},"modified":"2017-01-26T21:46:55","modified_gmt":"2017-01-26T12:46:55","slug":"jquery-%ec%9e%90%ec%a3%bc-%eb%ac%bb%eb%8a%94-%ec%a7%88%eb%ac%b8%eb%93%a4","status":"publish","type":"post","link":"http:\/\/www.gisdeveloper.co.kr\/?p=2385","title":{"rendered":"jQuery, \uc790\uc8fc \ubb3b\ub294 \uc9c8\ubb38\ub4e4"},"content":{"rendered":"

(\ubb38\uc81c) class\ub098 ID\ub97c \ud1b5\ud574 \uc5b4\ub5bb\uac8c \ud56d\ubaa9\uc744 \uc120\ud0dd\ud560 \uc218 \uc788\ub098\uc694?

<\/b><\/p>\n

\uc544\ub798\uc758 \ucf54\ub4dc\ub294 ID\uac00 #myDivId\uc778 \ud56d\ubaa9\uc744 \uc120\ud0dd\ud569\ub2c8\ub2e4.<\/P><\/p>\n

\r\n$('#myDivId');\r\n<\/pre>\n
\uc544\ub798\ub294 myCssClass\ub77c\ub294 class \uc774\ub984\uc744 \uac16\ub294 \uc694\uc18c\ub97c \uc120\ud0dd\ud569\ub2c8\ub2e4.<\/P><\/p>\n
\r\n$('.myCssClass');\r\n<\/pre>\n
(\ubb38\uc81c) \uc774 DOM \uc694\uc18c\ub97c \uac00\uc9c0\uace0 \uc788\uc744\ub54c, \uc774\ub97c \uc774\uc6a9\ud574 \uc694\uc18c\ub97c \uc5b4\ub5bb\uac8c \uc120\ud0dd\ud558\ub098\uc694? 
<\/b><\/p>\n
\uc544\ub798\uc758 \ucf54\ub4dc\ub294 ID\uac00 foo\uc778 DOM \uc694\uc18c\ub97c \uac00\uc9c0\uace0, \uc774 \uc694\uc18c\uc5d0 \ud3ec\ud568\ub41c \ubaa8\ub4e0 \uc694\uc18c\ub97c \uc120\ud0dd\ud558\uace0 \uc788\uc2b5\ub2c8\ub2e4.<\/P><\/p>\n
\r\nvar myDomElement = document.getElementById('foo');\r\n$(myDomElement).find('a');\r\n<\/pre>\n
(\ubb38\uc81c) \ud2b9\uc815 class\uac00 \uc9c0\uc815\ub418\uc5b4\uc838 \uc788\ub294 \uc694\uc18c\uc778\uc9c0 \ud655\uc778\uc740 \uc5b4\ub5bb\uac8c \ud558\ub098\uc694?
<\/b><\/p>\n
\uc544\ub798\uc758 \ucf54\ub4dc\ucc98\ub7fc hasClass\ub97c \uc0ac\uc6a9\ud558\uba74 \ub429\ub2c8\ub2e4.<\/P><\/p>\n
\r\n$( \"div\" ).click(function() {\r\n    if ( $( this ).hasClass( \"protected\" ) ) {\r\n        $( this )\r\n            .animate({ left: -10 })\r\n            .animate({ left: 10 })\r\n            .animate({ left: -10 })\r\n            .animate({ left: 10 })\r\n            .animate({ left: 0 });\r\n    }\r\n});\r\n<\/pre>\n
\ub610\ud55c \uc544\ub798\ucc98\ub7fc \uc694\uc18c\uc758 \uc0c1\ud0dc \ud655\uc778\uc774 \uac00\ub2a5\ud55c is \ud568\uc218\ub97c \uc0ac\uc6a9\ud574\uc11c\ub3c4 \uac00\ub2a5\ud569\ub2c8\ub2e4.<\/P><\/p>\n
\r\nif ( $( \"#myDiv\" ).is( \".pretty.awesome\" ) ) {\r\n    $( \"#myDiv\" ).show();\r\n}\r\n<\/pre>\n
is \ud568\uc218\ub294 \uc120\ud0dd\ub41c \uc694\uc18c\uac00 \uc228\uae40 \uc0c1\ud0dc\uc778\uc9c0\ub97c \ub2e4\uc74c\ucc98\ub7fc \ud655\uc778\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4.<\/P><\/p>\n
\r\nif ( $( \"#myDiv\" ).is( \":hidden\" ) ) {\r\n    $( \"#myDiv\" ).show();\r\n}\r\n<\/pre>\n
(\ubb38\uc81c) \uc120\ud0dd \uc694\uc18c\uac00 \uc788\ub294\uc9c0 \ud655\uc778\uc740 \uc5b4\ub5bb\uac8c \ud558\ub098\uc694?
<\/b><\/p>\n
\uc120\ud0dd\uc790\ub85c \uc5bb\uc740 \uacb0\uacfc\uc5d0 \ub300\ud574 .length \uc18d\uc131\uc73c\ub85c \uc544\ub798\ucc98\ub7fc \ud655\uc778\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4. length \uc18d\uc131\uc740 \uc120\ud0dd\uc790\uc5d0 \uc758\ud574 \uba87\uac1c\uc758 \uc694\uc18c\uac00 \uc120\ud0dd\ub418\uc5c8\ub294\uc9c0\uc5d0 \ub300\ud55c \uac1c\uc218\ub97c \ubc18\ud658\ud569\ub2c8\ub2e4.<\/P><\/p>\n
\r\nif ( $( \"#myDiv\" ).length ) {\r\n    $( \"#myDiv\" ).show();\r\n}\r\n<\/pre>\n
(\ubb38\uc81c) \ud1a0\uae00(toggled)\ub418\uc5b4\uc9c4 \uc694\uc18c\uc758 \uc0c1\ud0dc\ub97c \uc5b4\ub5bb\uac8c \uacb0\uc815\ud560 \uc218 \uc788\ub098\uc694?
<\/b><\/p>\n
\uc694\uc18c\uac00 \uc228\uaca8\uc838 \uc788\ub294\uc9c0\uc5d0 \ud655\uc778\ud558\ub294 \uac83\uc740 :visible\uacfc :hidden \uc120\ud0dd\uc790\ub97c \uc0ac\uc6a9\ud574 \ud30c\uc545\uc774 \uac00\ub2a5\ud558\ub2e4.<\/P><\/p>\n
\r\nvar isVisible = $( \"#myDiv\" ).is( \":visible\" );\r\nvar isHidden = $( \"#myDiv\" ).is( \":hidden\" );\r\n<\/pre>\n
\uac00\uc2dc\uc131\uc5d0 \uae30\ubc18\ud574 \uc694\uc18c\uc5d0 \ub300\ud55c \uac04\ub2e8\ud55c \uc870\uc791\uc744 \ud558\uace0\uc790 \ud55c\ub2e4\uba74, \ub2e8\uc9c0 \uc120\ud0dd\uc790\uc5d0\uc11c :visible\uc774\ub098 :hidden\uc744 \uc0ac\uc6a9\ud569\ub2c8\ub2e4. \uc544\ub798\uc774 \ucf54\ub4dc\ub97c \ubcf4\uc2dc\uae30 \ubc14\ub78d\ub2c8\ub2e4.<\/P><\/p>\n
\r\n$( \"#myDiv:visible\" ).animate({\r\n    left: \"+=200px\"\r\n}, \"slow\" );\r\n<\/pre>\n
(\ubb38\uc81c) \ud3fc \uc694\uc18c\uc5d0 \ub300\ud574 \ube44\ud65c\uc131\ud654\/\ud65c\uc131\ud654\ub294 \uc5b4\ub5bb\uac8c \ud558\ub098\uc694?
<\/b><\/p>\n
\uc544\ub798\uc758 \ucf54\ub4dc\ucc98\ub7fc prop \ud568\uc218\ub97c \uc0ac\uc6a9\ud574 \ud3fc \uc694\uc18c\ub97c \ud65c\uc131\ud654 \ud558\uac70\ub098 \ube44\ud65c\uc131\ud654 \ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4.<\/P><\/p>\n
\r\n\/\/ Disable #x\r\n$( \"#x\" ).prop( \"disabled\", true );\r\n\r\n\/\/ Enable #x\r\n$( \"#x\" ).prop( \"disabled\", false );\r\n<\/pre>\n
(\ubb38\uc81c) \uccb4\ud06c\ubc15\uc2a4 \ub610\ub294 \ub77c\ub514\uc624\ubc84\ud2bc\uc5d0 \ub300\ud55c \uccb4\ud06c\ub098 \uc5b8\uccb4\ud06c\ub294 \uc5b4\ub5bb\uac8c \ud558\ub098\uc694?
<\/b><\/p>\n
\uc544\ub798\uc758 \ucf54\ub4dc\ucc98\ub7fc prop \ud568\uc218\ub97c \uc0ac\uc6a9\ud574 \uccb4\ud06c \uc5ec\ubd80\ub97c \uacb0\uc815\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4.<\/P><\/p>\n
\r\n\/\/ Check #x\r\n$( \"#x\" ).prop( \"checked\", true );\r\n\r\n\/\/ Uncheck #x\r\n$( \"#x\" ).prop( \"checked\", false );\r\n<\/pre>\n
(\ubb38\uc81c) \uc120\ud0dd\ub41c option\uc758 \ud14d\uc2a4\ud2b8 \uac12\uc740 \uc5b4\ub5bb\uac8c \uc5bb\ub098\uc694?
<\/b><\/p>\n
\uc120\ud0dd \uc694\uc18c\ub294 \uc77c\ubc18\uc801\uc73c\ub85c \uc5bb\uc744 \uc218 \uc788\ub294 2\uac00\uc9c0 \uac12\uc774 \uc788\uc2b5\ub2c8\ub2e4. \uccab\ubc88\uc9f8\ub294 \uc11c\ubc84\ub85c \ubcf4\ub0b4\uc9c0\ub294 \uac12\uc774\uba70, \uc544\ub798\ucc98\ub7fc \uac04\ub2e8\ud788 \uc5bb\uc744 \uc218 \uc788\uc2b5\ub2c8\ub2e4.<\/P><\/p>\n
\r\n$( \"#myselect\" ).val();\r\n\/\/ => 1\r\n<\/pre>\n
\ub450\ubc88\uc9f8\ub294 \uc120\ud0dd\ub41c \uc694\uc18c\uc758 \ud14d\uc2a4\ud2b8 \uac12\uc778\ub370\uc694. \uc608\ub97c\ub4e4\uc5b4 \uc544\ub798\uc640 \uac19\uc740 \ucf54\ub4dc\uc640 \uac19\ub2e4\uace0 \ud569\uc2dc\ub2e4.<\/P><\/p>\n
\r\n