코딩도전기/J-Query6 J-Query_TEST Table에 열 추가하기 학번 이름 과목 학점 설명 학번 : 이름 : 과목 : 학점 : 설명 : 입 력 삭 제 2023. 2. 15. CODO Day11_J-Query(Method Chaining/요소 추가&삭제&면적) Method Chaining 각 기능들을 연결된 것처럼 맞물려서 연속적으로 실행시킬 수 있음 $(selector).css(“color”, “red”).slideUp(2000).slideDown(2000); 마우스를 따라 다녀요 ◈ 알고가기 clientX, clientY : 브라우저 화면을 기준 pageX, pageY : 전체 문서(HTML)를 기준 screenX, screenY : 모니터 화면을 기준 slide up 요소 추가* 제이쿼리를 사용하면 자바스크립트 보다 쉽게 요소를 추가 할 수 있음 $(selector).append( “추가내용” ); : 선택한 요소 내 마지막 요소에 추가 $(selector).prepend(“추가내용” ); : 선택한 요소 내 시작점에 추가 $(selector).after.. 2023. 2. 15. J-Query_TEST sample 1 ID 박스에 admin을 입력하고 확인을 누른 후 링크를 누르면 'gdu.co.kr'로 이동 다른 값을 입력하면 'google.co.kr'로 이동 ID : 확인 링크이동 sample 2 div 영역을 클릭할 때 마다 해당하는 div 영역을 클릭한 횟수를 자식 div에 표시 A 아이템 구매 수 0 B 아이템 구매 수 0 C 아이템 구매 수 0 2023. 2. 14. CODO Day10_J-Query(Attribute변경/css/addclass/hide&show/fade/slide/animate) * 이스케이프 문자 * \ : escape 문자 : 본래 문자가 가지고 있던 특수능력을 버리고 일반문자로 표시되게 하는 것 Attribute(member) 변경하기 $(selector).attr( “지정 속성”, “변경 내용” ); : 해당 요소의 지정된 속성을 변경 $(selector).val( “변경 내용” ); : 해당 요소의 값(value)을 변경 $(selector).text(“변경 내용” ); : 해당 요소의 텍스트 값을 변경(내부 html 태그 미포함) $(selector).html(“변경 내용” ); : 해당 요소의 텍스트 값을 변경(내부 html 태그 포함) 문자열 1 문자열 2 속성변경 css(); 특정 스타일을 확인하거나 변경할 경우 사용 단순한 스타일 적용에 활용 $(selector.. 2023. 2. 14. CODO Day9_J-Query(관계&Filtering&Event&속성) DOM 내 부모 자식 관계 관계를 이용하여 원하는 요소를 가져옴(selector) 부모 관계를 이용한 Select $(selector).parent( ); : 선택한 요소의 바로 위의 요소를 선택(한개만) $(selector).parents(selector); : 선택한 요소의 상위 요소들중 selector에 해당하는 요소들을 모두 선택 $(selector).parentsUntil(selector); : 선택한 요소와 지정한 요소 사이의 부모를 모두 선택 DIV(greate-grandparent) ul(grandparent) li(parent) span DIV(grand-parent) p(parent) span $(selector).closest(selector); : 선택한 요소로부터 부모 요소들 중 .. 2023. 2. 13. CODO Day8_J-Query(selector) J-Query란? JavaScript의 Library Library란? 자주 사용하거나, 직접 구현이 어려운 기능을 만들어 모아 놓은 Program Group JavaScript Library로는 J-Query 외에도 RequireJS, Prototye, AngluarJS, Backbone 등이 있다. J-Query를 사용하는 이유는? 1) 사용의 편리성 java script >> j-query(문장이 간결) 2) Cross Browsing Java Script는 Browser에서 해석하므로 종류나 버전마다 표현이 안되거나 다르게 되는 경우가 있다. J-Query에서는 내부적으로 Browser마다 처리를 해놓았기 때문에 신경 쓸 필요가 없다. 3) 다양한 Plugin J-Query를 기초로 한 유용한 P.. 2023. 2. 10. 이전 1 다음
