jQuery 변경 텍스트

Anika Tabassum Era 2024년2월15일

jQuery jQuery Text

jQuery의 text() 메소드
text() 메서드를 사용하여 jQuery를 사용하여 직접 텍스트 변경
text() 메서드를 사용하여 jQuery를 사용하여 클릭 이벤트로 텍스트 변경

jQuery에는 더 적은 수의 코드 라인으로 문제를 해결하기 위해 여러 규칙이 존재합니다. 유사하게, 추가는 text() 메소드입니다.

jQuery의 `text()` 메소드

일반적으로 text() 함수는 인스턴스에 적용될 때 특정 요소의 텍스트 값을 반환합니다. It's a line이라는 메시지가 있는 p 태그가 있다고 가정합니다.

따라서 다음과 같은 구문이 있습니다.

<p id="line"> It's a line.</p>

인스턴스에 text() 메서드를 적용하면 "It's a line."이 반환됩니다. 구문은 다음과 같습니다.

$('#line').text();  // output = "It's a line."

예제 세트에서 기존 텍스트를 기본 설정에 따라 새로운 것으로 변경하는 방법을 보여줍니다. 따라서 첫 번째 인스턴스는 구현이 직접 변경됩니다. 다음 이벤트는 클릭 이벤트로 진행됩니다. 들어가자!

`text()` 메서드를 사용하여 jQuery를 사용하여 직접 텍스트 변경

text() 메소드는 이 예제의 문자열 매개변수로 새 텍스트 값을 사용합니다. 당신은 또한 당신의 의지의 역동적인 가치를 시작할 수 있습니다.

정적 HTML 본문과 미리보기 페이지의 값을 변경하기만 하면 됩니다. 이를 검사하기 위해 코드 펜스를 확인합시다.

코드 조각:

<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
<script>
$(document).ready(function() {
    $('#title').text("New Text");
});
</script>
</head>
<body>
<p id='title'>Text</p>

출력:

text() 메서드를 사용하여 텍스트를 직접 변경 - 출력 1

text() 메서드를 사용하여 텍스트를 직접 변경 - 출력 2

`text()` 메서드를 사용하여 jQuery를 사용하여 클릭 이벤트로 텍스트 변경

여기에서의 절차는 이전 절차와 유사합니다. 여기서 기본적인 차이점을 만들면 변경 효과를 트리거하는 클릭 이벤트를 만들 것입니다.

또한 클릭 이벤트를 클릭할 때 HTML 본문 콘텐츠가 어떻게 편향되는지도 살펴보겠습니다. 코드 라인으로 이동합시다.

코드 조각:

<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
<script>
$(document).ready(function() {
  $('#press').click(function(){
    $('#title').text("Text Altered");
});
  });
</script>
</head>
<body>
<p id='title'>Text</p>
<button id="press">Text Change</button>