Użyj jquery, aby ustawić wartość znacznika div


81

Mam zdefiniowany znacznik DIV HTML:

<div style="height:100px; width:100px" class="total-title">
    first text
</div>

Mam kod jquery do zmiany jego wartości:

 $('div.total-title').html('test');

Ale to nie zmienia zawartości div.


2
Gdzie dokładnie wykonujesz instrukcję: $ ('div.total-title'). Html ('test'); ??
Niek H.

1
Nie ma absolutnie nic złego w kodzie, jeśli wywołasz kod js, gdy DOM jest gotowy. Farzad, odpowiedział poprawnie.
Simplyharsh

Odpowiedzi:


156

jeśli twoją wartością jest czysty tekst (np. „test”), możesz również użyć metody text (). lubię to:

$('div.total-title').text('test');

w każdym razie, jeśli chodzi o problem, który udostępniasz, myślę, że możesz wywoływać kod JavaScript, zanim kod HTML dla DIV zostanie wysłany do przeglądarki. upewnij się, że wywołujesz wiersz jQuery w tagu <script> po <div> lub w instrukcji takiej jak ta:

$(document).ready(
    function() {
        $('div.total-title').text('test');
    }
);

w ten sposób skrypt jest wykonywany po przeanalizowaniu przez przeglądarkę kodu HTML elementu div.


3
Kiedy ująłem to jak div.total-value, to nie działało. Ale po zrobieniu tego jak # total-value działa
Nipuna

dlaczego musisz rapować wokół anonimowej funkcji? czy będzie działać bez niego?
Nahser Bakht

Ponieważ strona nie została jeszcze skonfigurowana, jeśli nie została zakończona ładowanie, więc div może jeszcze nie istnieć, jeśli po prostu umieścisz surowy kod na najwyższym poziomie, powiedzmy, <head>.
DragonLord

wymagana jest funkcja gotowości lub anonimowa, aby opóźnić ocenę. Uważam, że w tym zbędnym przypadku kod jest przesadą, ale zachęca on opiekunów oprogramowania do kopiowania i wklejania, aby później unikali błędów.
DragonLord

tak, myślę, że powinno być$('#div.total-title').text('test');
hynsey

9

Aby wstawić tekst, użyj .text('text')

Jeśli chcesz użyć .html(SomeValue), SomeValue powinno mieć tagi HTML, które mogą znajdować się wewnątrz elementu div, to też musi działać.

Po prostu sprawdź lokalizację swojego skryptu, jak powiedział Farzad.

Źródła : .html i tekst


5

spróbuj tej funkcji $('div.total-title').text('test');


tekst jest teraz przestarzały, w wersji 1.4 lub wcześniejszej.
Rishabh

4

Odwołałeś się do pliku jQuery JS, prawda? Nie ma powodu, dla którego odpowiedź Farzada nie miałaby działać.


0

Podczas korzystania z .html()metody htmlStringparametr a musi być. ( źródło ) Umieść swój ciąg w tagu HTML i powinien działać lub używać .text()zgodnie z sugestią farzada.

Przykład:

<div class="demo-container">
    <div class="demo-box">Demonstration Box</div>
</div>

<script type="text/javascript">
$("div.demo-container").html( "<p>All new content. <em>You bet!</em></p>" );
</script>

0

użyj jak poniżej:

<div id="getSessionStorage"></div>

W tym celu użyj poniższego kodu w celach informacyjnych:

$(document).ready(function () {
        var storageVal = sessionStorage.getItem("UserName");
        alert(storageVal);
        $("#getSessionStorage").append(storageVal);
     });

To będzie wyglądać jak poniżej w html (zakładając storageVal = "Rishabh")

<div id="getSessionStorage">Rishabh</div>
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.