추천 과정:

jQuery 내용과 속성 가져오기

jQuery는 HTML 요소와 속성을操作할 수 있는 강력한 메서드를 가지고 있습니다。

jQuery DOM 작업

jQuery에서 매우 중요한 부분은 DOM을操作할 수 있는 능력입니다。

jQuery는 DOM과 관련된 다양한 메서드를 제공하여 요소와 속성에 접근하고操作하기 쉽게 합니다。안내:

DOM = Document Object Model（문서 객체 모델）

“W3C 문서 객체 모델은 플랫폼과 언어에 독립적이며, 프로그램과 스크립트가 문서의 내용, 구조 및 스타일을 동적으로 접근하고 업데이트할 수 있도록 합니다.”

내용 가져오기 - text()、html() 및 val()

DOM 작업을 위한 세 가지 간단하고 실용적인 jQuery 메서드：

  • text() - 선택된 요소의 텍스트 내용을 설정하거나 반환
  • html() - 선택된 요소의 내용(HTML 표시를 포함)을 설정하거나 반환
  • val() - 형식 필드의 값을 설정하거나 반환

다음 예제는 jQuery text()과 html() 메서드를 사용하여 내용을 얻는 방법을 보여줍니다：

예제

$("#btn1").click(function(){
  alert("Text: " + $("#test").text());
});
$("#btn2").click(function(){
  alert("HTML: " + $("#test").html());
});

자신의 손으로 시도해 보세요

다음 예제는 jQuery val() 메서드를 사용하여 입력 필드의 값을 얻는 방법을 보여줍니다：

예제

$("#btn1").click(function(){
  alert("Value: " + $("#test").val());
});

자신의 손으로 시도해 보세요

속성 가져오기 - attr()

jQuery attr() 메서드는 속성 값을 얻기 위해 사용됩니다。

다음 예제는 링크의 href 속성 값을 얻는 방법을 보여줍니다：

예제

$("button").click(function(){
  alert($("#w3s").attr("href"));
});

자신의 손으로 시도해 보세요

다음 장에서는 내용과 속성 값을 설정(변경)하는 방법을 설명할 것입니다。

jQuery HTML 참조 매뉴얼

jQuery HTML 메서드에 대한 전체 내용을 원하시면 다음 참조 매뉴얼을 방문하세요：