Μέθοδος html

Η μέθοδος html επιτρέπει την αλλαγή του κειμένου ενός στοιχείου και την λήψη του μαζί με τις ετικέτες.

Σύνταξη

Λήψη κειμένου:

$(επιλογέας).html();

Αλλαγή κειμένου:

$(επιλογέας).html(νέο κείμενο);

Πρόσθετα

Η μέθοδος html μπορεί να εφαρμόσει μια δεδομένη συνάρτηση σε κάθε στοιχείο σε ένα σύνολο. Σε αυτήν την περίπτωση, η συνάρτηση λαμβάνει ως πρώτη παράμετρο τον αριθμό του στοιχείου στο σύνολο, και ως δεύτερη παράμετρο - το τρέχον κείμενο του στοιχείου:

$(επιλογέας).html(function(αριθμός στο σύνολο, τρέχον κείμενο στοιχείου));

Τα ονόματα των μεταβλητών στη συνάρτηση μπορούν να είναι οποιαδήποτε. Για παράδειγμα, αν για την πρώτη παράμετρο δώσουμε το όνομα index - τότε μέσα στη συνάρτησή μας θα είναι διαθέσιμη η μεταβλητή index, στην οποία θα βρίσκεται ο αριθμός στο σύνολο για εκείνο το στοιχείο που η συνάρτηση επεξεργάζεται αυτήν τη στιγμή. Ομοίως, αν για τη δεύτερη παράμετρο δώσουμε, για παράδειγμα, το όνομα value - τότε μέσα στη συνάρτησή μας θα είναι διαθέσιμη η μεταβλητή value, στην οποία θα βρίσκεται το κείμενο εκείνου του στοιχείου που η συνάρτηση επεξεργάζεται αυτήν τη στιγμή:

$(επιλογέας).html(function(index, value) {

	// εδώ είναι διαθέσιμες οι μεταβλητές index και value
	
});

Το κείμενο κάθε στοιχείου θα αλλάξει σε εκείνο, που επιστρέφει η συνάρτηση συγκεκριμένα για αυτό το στοιχείο.

Παράδειγμα

Ας εμφανίσουμε στην οθόνη το περιεχόμενο της παραγράφου μας:

κείμενο

let text = $('#test').html();
alert(text);

Παράδειγμα

Ας αλλάξουμε το περιεχόμενο της παραγράφου μας:

κείμενο1 $('#test').html('κείμενο2');

Ο κώδικας HTML θα γίνει ως εξής:

κείμενο2

Παράδειγμα

Ας αλλάξουμε το περιεχόμενο της παραγράφου μας σε κείμενο με ετικέτες:

κείμενο1 $('#test').html('κείμενο2');

Ο κώδικας HTML θα γίνει ως εξής:

κείμενο2

Παράδειγμα

Ας προσθέσουμε στο τέλος κάθε παραγράφου τον τακτικό της αριθμό στο σύνολο:

<p>κείμενο</p>
<p>κείμενο</p>
<p>κείμενο</p>

$('p').html(function(index, value){
	return value + ' ' + index;
});

Ο κώδικας HTML θα γίνει ως εξής:

<p>κείμενο 0</p>
<p>κείμενο 1</p>
<p>κείμενο 2</p>

Δείτε επίσης

η μέθοδος text,
που επιτρέπει τη λήψη του κειμένου του στοιχείου χωρίς ετικέτες
Η ιδιότητα JavaScript innerHTML,
με τη βοήθεια της οποίας μπορείτε να αλλάξετε το κείμενο ενός στοιχείου σε καθαρό JavaScript
Η ιδιότητα JavaScript outerHTML,
με τη βοήθεια της οποίας μπορείτε να αλλάξετε το κείμενο ενός στοιχείου μαζί με την ετικέτα του σε καθαρό JavaScript