내부 교체 방법jQuery를 사용하는 div의 HTML?
다음 작업을 수행하려면 어떻게 해야 합니까?
document.all.regTitle.innerHTML = 'Hello World';
jQuery 사용처regTitle나의div아이디?
$("#regTitle").html("Hello World");
html() 함수는 HTML의 문자열을 사용할 수 있으며, 이 함수는 html을 효과적으로 변경할 수 있습니다..innerHTML소유물.
$('#regTitle').html('Hello World');
단, text() 함수는 지정된 요소의 (텍스트) 값을 변경하지만,html구조.
$('#regTitle').text('Hello world');
기존 내용 대신 렌더링할 jQuery 개체가 있는 경우:그러면 내용을 재설정하고 새 내용을 추가합니다.
var itemtoReplaceContentOf = $('#regTitle');
itemtoReplaceContentOf.html('');
newcontent.appendTo(itemtoReplaceContentOf);
또는 다음 중 하나를 선택합니다.
$('#regTitle').empty().append(newcontent);
답변은 다음과 같습니다.
//This is the setter of the innerHTML property in jQuery
$('#regTitle').html('Hello World');
//This is the getter of the innerHTML property in jQuery
var helloWorld = $('#regTitle').html();
요소의 내부 HTML을 변경하는 방법을 알려주는 답변이 이미 있습니다.
단, HTML을 바꾸려면 Fade Out/Fade In과 같은 애니메이션을 사용하는 것이 좋습니다.HTML을 바꾸면 내부 HTML을 즉시 변경할 수 있습니다.
애니메이션을 사용하여 내부 HTML 변경
$('#regTitle').fadeOut(500, function() {
$(this).html('Hello World!').fadeIn(500);
});
이것이 필요한 함수가 많으면 내부 HTML을 변경하는 공통 함수를 호출할 수 있습니다.
function changeInnerHtml(elementPath, newText){
$(elementPath).fadeOut(500, function() {
$(this).html(newText).fadeIn(500);
});
}
답변:
$("#regTitle").html('Hello World');
설명:
$와 동등하다jQuery둘 다 jQuery 라이브러리에서 동일한 개체를 나타냅니다.그"#regTitle"괄호 안에 있는 것을 선택기라고 부릅니다.jQuery 라이브러리는 코드를 적용할 html DOM(Document Object Model)의 요소를 식별하기 위해 사용합니다.그#전에regTitlejQuery에게 말합니다.regTitle는, DOM내의 요소의 ID 입니다.
여기서부터 도트 표기법은 내부 html 함수를 호출하기 위해 사용됩니다.이 함수는 괄호 사이에 배치한 파라미터로 대체됩니다.이 경우 다음과 같습니다.'Hello World'.
jQuery's.html()일치하는 비어 있지 않은 요소의 설정 및 내용을 가져오는 데 사용할 수 있습니다.innerHTML).
var contents = $(element).html();
$(element).html("insert content into element");
jquery에서 html 또는 text 함수를 사용하여 실행할 수 있습니다.
$("#regTitle").html("hello world");
또는
$("#regTitle").text("hello world");
예
$( document ).ready(function() {
$('.msg').html('hello world');
}); <!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
</head>
<body>
<div class="msg"></div>
</body>
</html>$("#regTitle")[0].innerHTML = 'Hello World';
퍼포먼스에 대한 통찰력을 추가하기 위해서입니다.
몇 년 전 프로젝트를 진행했는데, HTML/텍스트를 다양한 HTML 요소로 설정하려고 하는데 문제가 있었습니다.
요소를 '재작성'하여 DOM에 주입하는 것이 DOM 콘텐츠를 갱신하는 권장 방법보다 훨씬 빠른 것으로 나타났습니다.
예를 들어 다음과 같습니다.
var text = "very big content";
$("#regTitle").remove();
$("<div id='regTitle'>" + text + "</div>").appendTo("body");<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>더 좋은 공연을 할 수 있을 거야최근에는 그것을 측정해 본 적이 없습니다(요즘은 브루어들이 똑똑해야 합니다). 하지만 성능을 찾고 있다면 도움이 될 것입니다.
단점은 스크립트 내의 DOM과 참조가 올바른 오브젝트를 가리키도록 하는 작업이 많아진다는 것입니다.
순수 JS 및 최단
순수 JS
regTitle.innerHTML = 'Hello World'
regTitle.innerHTML = 'Hello World';<div id="regTitle"></div>최단
$(regTitle).html('Hello World');
// note: no quotes around regTitle
$(regTitle).html('Hello World'); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="regTitle"></div>jQuery를 사용하는 텍스트와 이 거의 .text() 번째 하면 됩니다.
$("#regTitle").text("Hello World");
,을 사용할 수 .html()대신 html 태그가 있으면...
var abc = document.getElementById("regTitle");
abc.innerHTML = "Hello World";
언급URL : https://stackoverflow.com/questions/1309452/how-to-replace-innerhtml-of-a-div-using-jquery
'itsource' 카테고리의 다른 글
| DeprecationWarning: 잘못된 이스케이프 시퀀스 - \d 대신 사용할 항목 (0) | 2022.10.15 |
|---|---|
| SQLSTATE [22007]:잘못된 날짜/시간 형식: 1292 잘못된 날짜/시간 값: '2008-03-30 02:56:12' (0) | 2022.10.15 |
| jQuery의 현재 날짜를 얻는 방법 (2) | 2022.10.15 |
| ECMAScript 6의 화살표 기능은 언제 사용해야 합니까? (1) | 2022.10.15 |
| segfault 커널 로그 메시지를 읽는 방법 (1) | 2022.10.15 |