parent() es un método incorporado en jQuery que se utiliza para encontrar el elemento principal relacionado con el elemento seleccionado. Este método parent() en jQuery atraviesa un solo nivel hacia arriba del elemento seleccionado y devuelve ese elemento.
Sintaxis:
$(selector).parent()
Aquí el selector son los elementos seleccionados cuyo padre necesita encontrar.
Parámetro: No acepta ningún parámetro.
Valor devuelto: Devuelve el padre de los elementos seleccionados.
código jQuery para mostrar el funcionamiento de esta función:
<html>
<head>
<style>
.main_div * {
display: block;
border: 1px solid green;
color: green;
padding: 5px;
margin: 15px;
}
</style>
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
<script>
$(document).ready(function() {
$("span").parent().css({
"color": "green",
"border": "2px solid green"
});
});
</script>
</head>
<body>
<div class="main_div">
<div style="width:500px;">div (Great-Grandparent)
<ul>This is the grand-parent of the selected span element.!
<li>This is the parent of the selected span element.!
<span>This is the span element !!!</span>
</li>
</ul>
</div>
</div>
</body>
</html>
En el código anterior, solo el elemento principal del elemento seleccionado adquiere un color verde intenso.
Producción:
Los padres() es un método incorporado en jQuery que se utiliza para encontrar todos los elementos principales relacionados con el elemento seleccionado. Este método parent() en jQuery atraviesa todos los niveles hasta el elemento seleccionado y devuelve todos los elementos.
Sintaxis:
$(selector).parents()
Aquí el selector es el elemento seleccionado cuyos padres deben encontrar.
Parámetros: No acepta ningún parámetro.
Valor devuelto: Devuelve todos los padres del elemento seleccionado.
código jQuery para mostrar el funcionamiento de esta función:
<html>
<head>
<style>
.main_body* {
display: block;
border: 2px solid green;
color: green;
padding: 5px;
margin: 15px;
}
</style>
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
<script>
$(document).ready(function() {
$("span").parents().css({
"color": "green",
"border": "2px solid green"
});
});
</script>
</head>
<body class="main_body">
<div style="width:500px;">This is the great grand parent of the selected span element.!
<ul>This is the grand parent of the selected span element.!
<li>This is the parent of the selected element.!
<span>This is the selected span element.!</span>
</li>
</ul>
</div>
</body>
</html>
En el código anterior, todo el elemento principal del seleccionado se muestra en color verde intenso.
Producción:
jQuery es una biblioteca JavaScript de código abierto que simplifica las interacciones entre un documento HTML/CSS. Es muy famosa por su filosofía de «Escribir menos, hacer más» .
Puede aprender jQuery desde cero siguiendo este tutorial de jQuery y ejemplos de jQuery .
Publicación traducida automáticamente
Artículo escrito por kundankumarjha y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA