컴퓨터이야기/JQuery jquery 기초 - html 요소 선택하기(선택자) by 변화지시자 2010. 12. 20. 반응형 <SPAN id=tx_marker_caret></SPAN><SPAN id=tx_marker_caret></SPAN> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script type="text/javascript" language="javascript1.2"> function test(){ (function($){ alert($('input').val()); //html 태크요소로 선택 alert($('.txtbox').val()); //html class요소로 선택 alert($('#txtId').val()); //html id요소로 선택 })(jQuery); } </script> </head> <body> <form id="form1" name="form1" method="post" action=""> <label>inputAddress <input type="text" name="txtName" id="txtId" class="txtbox" value="내 주소는" /> </label> <label>클릭 <input type="button" name="clickbutton" id="clickbutton" value="클릭" onclick="javascript:test()" /> </label> </form> </body> </html> <SPAN id=tx_marker_caret></SPAN> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> </head> <body> <form id="form1" name="form1" method="post" action=""> <label>inputAddress <input type="text" name="txtName" id="txtId" class="txtbox" value="내 주소는" /> </label> <label>클릭 <input type="button" name="clickbutton" id="clickbutton" value="클릭" /> </label> </form> <script type="text/javascript" language="javascript1.2"> //function test(){ (function($){ $('#clickbutton').click(function(){ alert($('input').val()); //html 태크요소로 선택 alert($('.txtbox').val()); //html class요소로 선택 alert($('#txtId').val()); //html id요소로 선택 }) })(jQuery); //} </script> </body> </html> 공유하기 게시글 관리 Change Agent(변화변혁 주도자) 저작자표시 관련글 Jquery validation plugin jQuery API 그림도표 트리 메뉴(슬라이딩 애니메이션) jquery 참조하면 좋을 사이트 하나