Wie bekomme ich Elternelement mit jquery

Question

Ich möchte die Schriftgröße des Elternelements erhöhen. Wenn ich meinen Code verwende, wird die Schriftgröße des ganzen Körpers erhöht. Wie kann ich dieses Problem vermeiden? Beispiel basierend auf der id="vs-1" Ich möchte hier 1940 die Schriftgröße des Grant Parent li Text erhöhen.

$("li #vs-1").parents().css({ 
 
    'color': '#ff3600', 
 
    'font-size': '35px' 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul> 
 
    <li>1940 
 
    <ul> 
 
     <li style="background-color: rgb(255, 54, 0);" id="vs-1"></li> 
 
    </ul> 
 
    </li> 
 
    <li>1970 
 
    <ul> 
 
     <li id="vs-2"></li> 
 
    </ul> 
 
    </li> 
 
</ul>

Wenn ich diesen Code verwenden sie den ganzen Körper ul li-Tag beeinflussen. Bitte gib mir die Lösung. Danke

Answer 1

Sie auf dem richtigen Weg waren, sollten Sie nur die Eltern in .parents() Anruf angeben:

$('li #vs-1').parents("li").css({'color':'#ff3600','font-size':'35px'}); 
______________________^^^^ 

Hoffnung, das hilft.

$("li #vs-1").parents('li').css({ 
 
    'color': '#ff3600', 
 
    'font-size': '35px' 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul> 
 
    <li>1940 
 
    <ul> 
 
     <li style="background-color: rgb(255, 54, 0);" id="vs-1"></li> 
 
    </ul> 
 
    </li> 
 
    <li>1970 
 
    <ul> 
 
     <li id="vs-2"></li> 
 
    </ul> 
 
    </li> 
 
</ul>

Answer 2

Aktualisiert: müssen Eltern erreichen und dann closest() verwenden. Bitte überprüfen Sie unter snnippet

$(function(){ 
 
    $("li #vs-1").parent().closest("li").css({'color':'#ff3600','font-size':'35px'}); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul> 
 
    <li>1940 
 
    <ul> 
 
     <li style="background-color: rgb(255, 54, 0);" id="vs-1"></li> 
 
    </ul> 
 
    </li> 
 
    <li>1970 
 
    <ul> 
 
     <li id="vs-2"></li> 
 
    </ul> 
 
    </li> 
 
</ul>

Answer 3

ein paar Dinge:
Um achive, was Sie wollen, Sie $('...').parents()[1].css({'...'});
die .parents() Methode gibt ein Array aller Eltern, und das erste Element des Arrays verwenden können, ist die unmittelbarer Elternteil.
Da Sie eine ID des Elements haben, das Sie auswählen möchten, müssen Sie nicht li davor haben.
Siehe docs

Answer 4

Sie wollen nur Stil Mutter li, nicht, dass li selbst. Versuchen Sie folgendes:

$("li #vs-1").parent('li').css({ 
    'color': '#ff3600', 
    'font-size': '35px' 
}); 

$("li #vs-1").closest('li').css({ 
    'color': '#000', 
    'font-size': '16px' 
}); 

https://jsfiddle.net/9u9hb839/2/