본문 바로가기
728x90
300x250
SMALL

javaScript545

[jQuery]input 입력 값 받아서 리스트로 등록 input 텍스트에 입력 하고 "추가"버튼 클릭 시 member 태그 안에 리스트 생성해서 제일 마지막에 추가 html 추가 js $(document).ready(function() { $("#add").click(function(){ memberName = $("#memberName").val(); //입력값 memberName 변수에 저장 $(".member").append(`${memberName}`) //append 메서드로 .member 마지막에 추가 }) }); 위에 같이 작성해도 동작은 하지만 ready메서드에 직접 작성하지 않고 효율성을 위해 기능별로 함수를 활용해 정리 해주면 아래와 같이 작성할 수 있다. js var $member=null; var $memberName=null; $(d.. 2023. 2. 2.
[jQuery]태그 내용 삭제 html() remove()의 차이 html() 대상.html("") 자식 내용을 모두 지울 경우 remove()를 사용할 수도 있지만 html()메서드를 사용하는 것이 더 효과적이다. 리스트 삭제 A B C D 실행결과 버튼을 클릭하면 li내용이 다 삭제 remove를 사용할 경우 리스트 삭제 A B C D .list ul부터 삭제됨 2023. 2. 1.
[jQuery] 리스트 요소 여러개 한번에 추가 하기 append() html() 차이 리스트 요소 여러개 추가 하는 방법은 일반적으로 2가지 방법이 있다. 1. append() 메서드 이용 리스트 추가 2. html() 메서드 이용 리스트 추가 2개 모두 결과는 같지만 대량으로 처리 할 경우 html()메서드를 이용해서 하나의 변수에 정보를 묶어서 처리 하는게 훨씬 효율적이고 속도가 빠르다. 2023. 1. 31.
[jQuery] 태그 내용 수정하기 html() text() 태그 내용 수정하기 $대상.html(수정할 태그 문자열) $대상.text(수정할 텍스트) html() 클릭한 리스트를 E로 변경 A B C D 실행결과 text() 만약 같은 내용을 text()로 메서드만 변경할 경우에는 태그가 아니라 문자열로 변경된다. A B C D 실행결과 2023. 1. 30.
728x90
반응형
LIST