본문 바로가기
728x90

분류 전체보기89

[jQuery] remove(), empty() 메서드 jQuery의 remove() 메서드는 선택한 요소를 웹 페이지에서 삭제합니다. empty() 메서드는 삭제한다는 점에서 유사하지만, 선택된 요소의 내용/자식 요소만 삭제한다는 차이가 있습니다. 다음 코드는 remove() 메서드와 empty() 메서드가 사용된 코드입니다. 111 222 333 444 이 HTML 코드는 삭제되는 요소를 제외한 다음 코드와 같은 결과를 만듭니다. 444 2023. 9. 22.
[jQuery] prop() 메서드 vs attr() 메서드 jQuery에서 prop() 메서드와 attr() 메서드는 이름으로부터 유추할 수 있듯이, 각각 property와 attribute을 가져오거나 변경합니다. property와 attribute는 둘 다 "속성"으로 번역이 될 수 있는데, 의미하는 바는 다릅니다. property의 경우, 자바스크립트의 관점에서의 속성을 뜻합니다. 버튼의 disabled 여부, 체크박스가 체크되었는지 등이 그 예시입니다. 즉, HTML 코드에서는 보이지 않는 요소의 상태와 관련된 역할을 합니다. 자바스크립트의 관점이기 때문에, property의 변경은 주로 페이지의 내부 동작을 변경하는 것입니다. 따라서 prop() 메서드는 주로 불리언 값을 다루게 됩니다. let isChecked = $('#ex_checkbox').pr.. 2023. 9. 21.
[jQuery] html(), text() 메서드 jQuery에서 html() 메서드와 text() 메서드는 선택한 요소의 내용을 가져오거나 변경합니다. 다음은 각 메서드의 사용 구문입니다. .html() .html(htmlString) .text() .text(textString) 메서드가 인자를 받지 않으면, 선택된 요소의 내용을 가져옵니다. 만약 메서드가 인자를 받았다면, 선택된 요소의 내용을 전달받은 인자로 변경합니다. 다음의 코드 예시를 통해 메서드의 주요 사용 방법을 알아보겠습니다. Difference between html() and text() Hello World! 12행 : html() 메서드를 통해 가져온 h1 태그의 내용을 h1_content 변수에 저장합니다. 13행 : html() 메서드를 통해 id 값이 "ex1"인 요소의 h.. 2023. 9. 20.
[jQuery] css() 메서드 jQuery에서 css() 메서드는 선택 요소의 css 속성 값을 가져오거나 변경합니다. 다음은 css() 메서드의 사용 구문입니다. .css(propName) .css(propName, value) 다음의 코드 예시를 통해 메서드의 주요 사용 방법을 알아보겠습니다. Title of Page 12행 : css() 메서드를 통해 가져온 h1 태그의 "color" 속성 값을 prev_color 변수에 저장합니다. 13행 : css() 메서드를 통해 기존 h1 태그의 "color" 속성 값을 변경합니다. css() 메서드가 선택할 수 있는 요소가 여러 개라면, 웹페이지에서 가장 먼저 찾은 요소에 동작하게 됩니다. css() 메서드 다수의 속성 값을 선택하거나 변경할 수도 있습니다. 이 때는 속성들로 구성된 배.. 2023. 9. 13.
[jQuery] addClass(), removeClass() 메서드 HTML 삽입 미리보기할 수 없는 소스 addClass()를 사용해서 만든 버튼입니다. 이번 글에서는 이러한 버튼을 만드는 코드에 대해서 설명하겠습니다. $ 함수는 요소, 클래스, 태그 등을 선택할 수 있습니다. 이 때 여러 개의 요소, 클래스, 태그 등을 선택하고자 할 때는 쉼표로 구분해서 작성하면 됩니다. $("#id3, .class2, h1") $ 함수로 선택한 것들에 일괄적으로 클래스를 추가하거나 삭제할 수 있습니다. addClass() 메서드가 전자에, removeClass() 메서드가 후자에 해당합니다. 여러 개의 클래스를 동시에 추가하거나 삭제할 수 있는데, 이 때는 스페이스로 각 클래스명을 구분하면 됩니다. $("#button_ex").addClass("animated bounce"); /.. 2023. 9. 12.
jQuery에 대하여 Write less, do more. jQuery는 오픈 소스 기반의 자바스크립트 라이브러리입니다. "Write less, do more."이라는 모토를 가지고 있는 만큼, jQuery는 다양한 기능을 쉽게 사용할 수 있도록 합니다. 다음은 jQuery의 장점과 특징들 중 일부를 나열한 것입니다. - DOM 요소 조작 - 요소들의 CSS 조작 - 간단한 애니메이션 제공 - 대부분의 웹브라우저에서 지원 - 다양한 플러그인 존재 jQuery를 사용하기 전에 jQuery 라이브러리를 웹페이지에 로드해야 합니다. 로드하기 위해서는 1) 파일을 다운로드 받거나 2) CDN(Content Delivery Network)를 이용할 수 있습니다. 1) 전자의 경우 와 같은 형태로 사용합니다. 이 때 파일은 서버에 저장.. 2023. 9. 11.
반응형

티스토리툴바