El objeto DOM Li se utiliza para representar el elemento HTML <li> . Se accede al elemento li mediante getElementById() .
Propiedades:
- valor : tiene un atributo llamado valor que se utiliza para devolver el valor del atributo de valor de la etiqueta <li>
Sintaxis:
document.getElementById("ID");
Donde “id” es el ID asignado a la etiqueta “li” .
Ejemplo 1:
html
<!DOCTYPE html>
<html>
<head>
<title>DOM li Object</title>
</head>
<body>
<h1>GeeksforGeeks</h1>
<h2>DOM Li Object </h2>
<ol>
<!-- Assigning id to 'li tag' -->
<li id="GFG">Geeks</li>
<li>Sudo</li>
<li>Gfg</li>
<li>Gate</li>
<li>Placement</li>
</ol>
<button onclick="myGeeks()">Submit</button>
<script>
function myGeeks() {
// Accessing 'li' tag.
var g = document.getElementById("GFG");
g.value = "100";
}
</script>
</body>
</html>
Salida:
antes de hacer clic en el botón:
Después de hacer clic en el botón:
Ejemplo-2: <li> El objeto se puede crear utilizando el método document.createElement .
html
<!DOCTYPE html>
<html>
<head>
<title>DOM li Object</title>
</head>
<body>
<h1>GeeksforGeeks</h1>
<h2>DOM Li Object </h2>
<ol ID="GFG">
<li>Geeks</li>
<li>Sudo</li>
<li>Gfg</li>
<li>Gate</li>
</ol>
<button onclick="myGeeks()">Submit</button>
<script>
function myGeeks() {
// li tag created.
var G = document.createElement("LI");
var F = document.createTextNode("Placement");
G.appendChild(F);
document.getElementById("GFG").appendChild(G);
}
</script>
</body>
</html>
Salida:
antes de hacer clic en el botón:
Después de hacer clic en el botón:
Navegadores compatibles: los navegadores compatibles con DOM Li Object se enumeran a continuación:
- Google Chrome
- explorador de Internet
- Firefox
- Ópera
- Safari
Publicación traducida automáticamente
Artículo escrito por ManasChhabra2 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA