La tarea es seleccionar los elementos con id usando la forma abreviada de document.getElementById con la ayuda de JavaScript. vamos a discutir algunas técnicas.
Enfoque 1:
- Defina una función que devuelva document.getElementById(‘idName’) .
- Este método toma IDName como primer y único argumento.
- Llame al método con ID como argumento.
Ejemplo 1: en este ejemplo, se crea una función que devuelve document.getElementById(‘idName’) .
<!DOCTYPE HTML>
<html>
<head>
<title>
How to write shorthand for
document.getElementById()
method in JavaScript ?
</title>
</head>
<body style="text-align:center;">
<h1 style="color:green;">
GeeksForGeeks
</h1>
<p id="GFG_UP" style=
"font-size: 19px; font-weight: bold;">
</p>
<button onclick="GFG_Fun()">
click here
</button>
<p id="GFG_DOWN" style=
"color: green; font-size: 24px; font-weight: bold;">
</p>
<script>
var ID = function(elementId) {
return document.getElementById(elementId);
};
var el_up = ID("GFG_UP");
var el_down = ID("GFG_DOWN");
el_up.innerHTML = "Click on the button to select"
+ " the element by shorthand instead"
+ " of getElementById.";
function GFG_Fun() {
el_down.innerHTML = "Element selected by "
+ "shorthand of getElementById";
}
</script>
</body>
</html>
Producción:
- Antes de hacer clic en el botón:
- Después de hacer clic en el botón:
Enfoque 2:
- Defina un prototipo = document.getElementById .
- Use este prototipo pasando IDName como el primer y único argumento en lugar de document.getElementById .
Ejemplo 2: en este ejemplo, se crea un prototipo de documento HTML que luego se usa para seleccionar el elemento por IDName .
<!DOCTYPE HTML>
<html>
<head>
<title>
How to write shorthand for
document.getElementById()
method in JavaScript ?
</title>
</head>
<body style="text-align:center;">
<h1 style="color:green;">
GeeksForGeeks
</h1>
<p id="GFG_UP" style=
"font-size: 19px; font-weight: bold;">
</p>
<button onclick="GFG_Fun()">
click here
</button>
<p id="GFG_DOWN" style=
"color: green; font-size: 24px; font-weight: bold;">
</p>
<script>
HTMLDocument.prototype.e = document.getElementById;
var el_up = document.e("GFG_UP");
var el_down = document.e("GFG_DOWN");
el_up.innerHTML = "Click on the button to select"
+ " the element by shorthand instead of "
+ "getElementById.";
function GFG_Fun() {
el_down.innerHTML = "Element selected by "
+ "shorthand of getElementById";
}
</script>
</body>
</html>
Producción:
- Antes de hacer clic en el botón:
- Después de hacer clic en el botón:
Publicación traducida automáticamente
Artículo escrito por PranchalKatiyar y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA