Yanıtlar:
Html () işlevi HTML dizeleri alabilir ve etkili bir şekilde değiştirir .innerHTMLözelliği.
$('#regTitle').html('Hello World');Ancak, text () işlevi belirtilen öğenin (metin) değerini değiştirir, ancak htmlyapıyı korur.
$('#regTitle').text('Hello world'); text()olarak farklıdır: Unlike the .html() method, .text() can be used in both XML and HTML documents.. Bundan başka, uygun stackoverflow.com/questions/1910794/... , jQuery.html() treats the string as HTML, jQuery.text() treats the content as text.
Bunun yerine, var olan içerik yerine oluşturmak istediğiniz bir jquery nesneniz varsa: Sadece içeriği sıfırlayın ve yenisini ekleyin.
var itemtoReplaceContentOf = $('#regTitle');
itemtoReplaceContentOf.html('');
newcontent.appendTo(itemtoReplaceContentOf);Veya:
$('#regTitle').empty().append(newcontent);itemtoReplaceContentOf.empty();
newcontentbir jQuery nesnesi nedir? Bu belli değil.
htmlStringya da Elementya da Textya da Arrayya jQueryuygun olarak api.jquery.com/append
İşte cevabınız:
//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();Cevap:
$("#regTitle").html('Hello World');Açıklama:
$eşittir jQuery. Her ikisi de jQuery kütüphanesinde aynı nesneyi temsil eder. "#regTitle"Parantez içindeki denir seçici sen kodu uygulamak istediğiniz html DOM (Document Object Model) hangi eleman (lar) tespit etmek jQuery kütüphanesinde tarafından kullanılır. Daha #önce regTitlejQuery'yeregTitle DOM içinde bir elemanın kimliğidir.
Oradan, nokta gösterimi, iç html'yi parantez arasına yerleştirdiğiniz herhangi bir parametreyle değiştiren html işlevini çağırmak için kullanılır , bu durumda bu 'Hello World'.
Öğenin İç HTML'sinin nasıl değiştirileceğini veren cevaplar zaten var.
Ancak, değiştirilen HTML'nin iyi bir şekilde iç HTML'i değiştirmesini sağlayan HTML'yi değiştirmek için Fade Out / Fade In gibi bazı animasyonlar kullanmanız önerilir.
$('#regTitle').fadeOut(500, function() {
$(this).html('Hello World!').fadeIn(500);
});Buna ihtiyaç duyan birçok fonksiyonunuz varsa, dahili Html'yi değiştiren ortak fonksiyonu çağırabilirsiniz.
function changeInnerHtml(elementPath, newText){
$(elementPath).fadeOut(500, function() {
$(this).html(newText).fadeIn(500);
});
}jquery'de html veya metin işlevini kullanarak bunu elde edebilirsiniz
$("#regTitle").html("hello world");VEYA
$("#regTitle").text("hello world");jQuery's .html(), eşleşen boş olmayan öğelerin ( innerHTML) içeriğini ayarlamak ve almak için kullanılabilir .
var contents = $(element).html();
$(element).html("insert content into element");Misal
$( 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';Sadece bazı performans bilgileri eklemek için.
Birkaç yıl önce, çeşitli HTML öğelerine büyük bir HTML / Metin ayarlamaya çalışırken sorun yaşadığımız bir projem vardı.
Öğeyi "yeniden oluşturmak" ve DOM'a enjekte etmek, DOM içeriğini güncellemek için önerilen yöntemlerden herhangi birinden çok daha hızlı görünüyordu.
Yani şöyle bir şey:
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>Size daha iyi bir performans sağlamalısınız. Son zamanlarda bunu ölçmeye çalışmadım (tarayıcılar bu günlerde akıllı olmalı), ancak performans arıyorsanız yardımcı olabilir.
Dezavantajı, DOM ve komut dosyalarınızdaki referansları doğru nesneyi işaret edecek şekilde daha fazla çalışmanız olacaktır.