요소의 HTML 구조 또는 요소의 텍스트 내용을 읽고 수정하는 것은 일반적인 DOM 작업입니다. jQuery는 이러한 처리를 위한 두 가지 편리한 방법을 제공합니다. 컬렉션에서 첫 번째 일치 요소의 HTML 콘텐츠를 설정하거나 일치하는 각 요소의 HTML 콘텐츠를 설정합니다. 이를 사용하는 세 가지 방법이 있습니다:
.html()은 값을 전달하지 않고 첫 번째 HTML만 가져옵니다. 컬렉션의 일치 요소입니다. .html( htmlString ) 일치하는 각 요소의 html 콘텐츠를 설정합니다.
.html( function(index, oldhtml) )은 HTML 콘텐츠를 설정하는 함수를 반환하는 데 사용됩니다.
참고: .html() 메소드는 내부적으로 사용되며 DOM의 innerHTML 속성으로 처리되기 때문에 설정 및 획득 시 주의해야 할 가장 중요한 문제는 이 작업이 전체 HTML 콘텐츠(텍스트 콘텐츠뿐만 아니라)에 대한 것이라는 점입니다
Let's 다음 html() 메소드 중 일부를 살펴보십시오. 예
html 요소의 내용을 변경하는 방법 코드는 다음과 같습니다.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
</head>
<body>
<div id="dv">php 中文网</div>
<script type="text/javascript">
$('#dv').html("www.php.cn");
</script>
</body>
</html>- div 태그의 내용 변경
2.
예를 들어 위의 예에서는 ｐｈｐ중국어 웹사이트 뒤에 URL을 추가해야 합니다. 이를 구현하려면 어떻게 해야 하나요?
다음 코드를 참조하세요.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
</head>
<body>
<div id="dv">php 中文网</div>
<script type="text/javascript">
$('#dv').append("www.php.cn");
</script>
</body>
</html>위의 예에서 볼 수 있듯이 www.php.cn div 태그에 대한 URL
메서드 뒤와 앞
after: 일치하는 모든 요소 뒤에 HTML 콘텐츠 삽입
before: 일치하는 모든 요소 앞에 HTML 콘텐츠 삽입
예를 들어 위의 예는 , div 태그 앞이나 뒤에 콘텐츠를 추가하는 방법
다음 예:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
</head>
<body>
<div id="dv">php 中文网</div>
<script type="text/javascript">
$('#dv').before("欢迎来到：");
$("#dv").after("学习编程");
</script>
</body>
</html>text () 메서드
하위 항목을 포함하여 일치하는 요소 집합에 있는 각 요소의 결합된 텍스트 콘텐츠를 가져오거나 텍스트를 설정합니다. 지정된 텍스트 콘텐츠로 설정된 일치 요소의 각 요소 콘텐츠입니다. , 세 가지 구체적인 용도가 있습니다.
.text() 해당 하위 항목을 포함하여 일치하는 요소 집합에 있는 각 요소의 병합된 텍스트를 가져옵니다.
.text( textString ) 은 일치하는 요소 콘텐츠의 텍스트를 설정하는 데 사용됩니다
. text( function (index, text) )는 설정된 텍스트 내용을 반환하는 데 사용되는 함수입니다
아래 예를 참조하세요:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
</head>
<body>
<div id="dv">php 中文网</div>
<script type="text/javascript">
alert($('#dv').text());
</script>
</body>
</html>다음 섹션