Inhaltsverzeichnis
Wie findet JQuery das vorletzte Element? Wenn es beispielsweise 5 ULs in einem p gibt, wie kann JQuery den vorletzten UL, den zweiten UL und den ersten UL-Stil sperren?" >Wie findet JQuery das vorletzte Element? Wenn es beispielsweise 5 ULs in einem p gibt, wie kann JQuery den vorletzten UL, den zweiten UL und den ersten UL-Stil sperren?
Heim Web-Frontend HTML-Tutorial Jquery und JS erhalten das li-Tag in ul

Jquery und JS erhalten das li-Tag in ul

Jun 27, 2017 pm 01:25 PM
javascript jquery 获取

js ruft alle li unter dem Element

var content=document.getElementById("content"); items=content.
getElementsByTagName("ul"); itemss=items[2].getElementsByTagName("li");//Holen Sie sich das zweite li-Tag
oder

var p=document.getElementById('a');

var ul=p.childNodes.item(0);

var lis=ul.childNodes; i=0;ialert("Item "+i+": "+lis.item(i).innerHTML>}




So verwenden Sie JQuery, um das letzte Li unter jedem Ul zu erhalten

$(function(){

$("ul").each(function(){

    vary = $(this).children().last();

    alert(y.text());

});

});


jquery erhält
    das angeklickte

    •                                                                                                ;/li>

    • Antwortliste li> 
    • Fragenliste
    • Zufriedenheitsliste a>




    Klicken Sie darauf und fügen Sie den class="qhbg"-Stil hinzu

    dazu

  • . Zum Beispiel: Klicken Sie auf die Antwortliste, um
    • Punktestand
    • Antwortliste

    • Fragenliste
    • > ;
    • Zufriedenheitsliste



    • $(function(){

      $('.anserdh li a').click(function(){

      $('.anserdh li').removeClass('qhbg') ;

      $(this).parent().addClass('qhbg');

      })

      })

      Wie findet JQuery das vorletzte Element? Wenn es beispielsweise 5 ULs in einem p gibt, wie kann JQuery den vorletzten UL, den zweiten UL und den ersten UL-Stil sperren?

      $("p ul").eq(-1)
      Nach dem Login kopieren
      $("p ul").eq(-2)
      Nach dem Login kopieren

      $(&#39;ul li<a href="http://www.php.cn/wiki/972.html" target="_blank">:first-child</a>&#39;).css(&#39;backgroundColor&#39;, &#39;#000&#39;);

      Einiges über das Durchlaufen von Elementen durch .each() in jquery


      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
      <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
      <head>
          <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
          <title>tab选项卡</title>
          <style type="text/css">
              ul,li{list-style: none;margin: 0px; padding: 0px;}
              li{float: left;width: 80px; height: 30px; background-color: #ccc; border: 2px solid #fff;text-align:center; line-height:30px;}
              #content{clear:left; width:336px; height: 180px; background-color: #999; color:white;}
              #content p{display: none}
              #content .consh{display: block;}
              #title .titsh{background-color: #999;border:2px solid #999; color:#fff}
          </style>
          <script type="text/javascript" src="jquery.js"></script>
          <script type="text/javascript">
              $(function(){
                  $("li").each(function(index){
                      $(this).mouseover(function(){
                          $("#title .titsh").removeClass("titsh");
                          $("#content .consh").removeClass("consh");
                          $(this).addClass("titsh");
                          $("#content>p:eq("+index+")").addClass("consh");
                      })
                  })                
              })
          </script>
      </head>
      <body>
          <p id="tab">
              <p id="title">
                  <ul>
                      <li class="titsh">选项一</li>
                      <li>选项二</li>
                      <li>选项三</li>
                      <li>选项四</li>
                  </ul>
              </p>
              <p id="content">
                  <p class="consh">内容一</p>
                  <p>内容二</p>
                  <p>内容三</p>
                  <p>内容四</p>
          </p>
      </p>
      </body>
      </html>
      Nach dem Login kopieren

      Jquery und JS erhalten das li-Tag in ul

      Die Testergebnisse waren normal. Als ich es später auf einer tatsächlichen Seite verwendete, stellte ich fest, dass sich der p-Block unten nicht in andere Bereiche änderte, da ich dachte, dass das CSS Stilkonflikte mit anderen Stilen auf der tatsächlichen Seite. Nachdem ich alle CSS-Selektoren in eindeutige geändert hatte, stellte ich fest, dass das Problem immer noch besteht, also kam ich zu dem Schluss, dass es hier sein sollte:

      $("#title .titsh").removeClass("titsh");
      $("#content .consh").removeClass("consh");
      $(this).addClass("titsh");
      $("#content>p:eq("+index+")").addClass("consh");
      
      第一句,第二句取出样式的时候,没有问题,第三局给当前的li标签加上titsh的css样式也正常,就是最后一句 给通过p:eq(index)获取到的p区块加样式的时候失败。
      
      于是我在
      Nach dem Login kopieren
      $("li").each(function(index){
      $(this).mouseover(function(){
      这两句之间加了一个alert(index)弹窗,看看效果,发现有10几个li标签的索引值被alert出来,一想原来实际这个页面中还有其他的li标签,所以导致each()迭代出来的索引值和下面p区块的索引值对应不上,这样上面li标签变动的时候,下面的p区块就不跟着变了,于是我将js代码改了一下:
      Nach dem Login kopieren


      Jquery und JS erhalten das li-Tag in ul

        <script type="text/javascript">
          $(function(){
                $("#title ul li").each(function(index){
                  $(this).click(function(){
                    $("#title .titsh").removeClass("titsh");
                    $("#content .consh").removeClass("consh");
                    $(this).addClass("titsh");
                    $("#content > p:eq("+index+")").addClass("consh");
                  })
                })                
              })
        </script>
      Nach dem Login kopieren

      Jquery und JS erhalten das li-Tag in ul

      Einschränkungen hinzugefügt Der Selektor des li-Elements muss mit .each() iteriert werden, sodass er in meinem Tab nur den li-Tag finden kann, um den Indexwert zu erhalten. Das Problem ist gelöst und ich kann schlafen gehen!

      Das obige ist der detaillierte Inhalt vonJquery und JS erhalten das li-Tag in ul. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

      Erklärung dieser Website
      Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

      Heiße KI -Werkzeuge

      Undresser.AI Undress

      Undresser.AI Undress

      KI-gestützte App zum Erstellen realistischer Aktfotos

      AI Clothes Remover

      AI Clothes Remover

      Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

      Undress AI Tool

      Undress AI Tool

      Ausziehbilder kostenlos

      Clothoff.io

      Clothoff.io

      KI-Kleiderentferner

      AI Hentai Generator

      AI Hentai Generator

      Erstellen Sie kostenlos Ai Hentai.

      Heißer Artikel

      R.E.P.O. Energiekristalle erklärten und was sie tun (gelber Kristall)
      3 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
      R.E.P.O. Beste grafische Einstellungen
      3 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
      R.E.P.O. So reparieren Sie Audio, wenn Sie niemanden hören können
      3 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
      WWE 2K25: Wie man alles in Myrise freischaltet
      3 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌

      Heiße Werkzeuge

      Notepad++7.3.1

      Notepad++7.3.1

      Einfach zu bedienender und kostenloser Code-Editor

      SublimeText3 chinesische Version

      SublimeText3 chinesische Version

      Chinesische Version, sehr einfach zu bedienen

      Senden Sie Studio 13.0.1

      Senden Sie Studio 13.0.1

      Leistungsstarke integrierte PHP-Entwicklungsumgebung

      Dreamweaver CS6

      Dreamweaver CS6

      Visuelle Webentwicklungstools

      SublimeText3 Mac-Version

      SublimeText3 Mac-Version

      Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

      Wo Sie den Google-Sicherheitscode erhalten Wo Sie den Google-Sicherheitscode erhalten Mar 30, 2024 am 11:11 AM

      Google Authenticator ist ein Tool zum Schutz der Sicherheit von Benutzerkonten. Sein Schlüssel sind wichtige Informationen, die zur Generierung dynamischer Bestätigungscodes verwendet werden. Wenn Sie den Schlüssel von Google Authenticator vergessen haben und ihn nur über den Sicherheitscode überprüfen können, wird Ihnen der Herausgeber dieser Website hoffentlich weiterhelfen Erfahren Sie mehr. Benutzer lesen bitte weiter unten! Öffnen Sie zunächst die Telefoneinstellungen und rufen Sie die Einstellungsseite auf. Scrollen Sie auf der Seite nach unten und suchen Sie nach Google. Gehen Sie zur Google-Seite und klicken Sie auf Google-Konto. Rufen Sie die Kontoseite auf und klicken Sie unter dem Bestätigungscode auf „Anzeigen“. Geben Sie Ihr Passwort ein oder verwenden Sie Ihren Fingerabdruck, um Ihre Identität zu überprüfen. Besorgen Sie sich einen Google-Sicherheitscode und verwenden Sie den Sicherheitscode, um Ihre Google-Identität zu überprüfen.

      Wie verwende ich die PUT-Anfragemethode in jQuery? Wie verwende ich die PUT-Anfragemethode in jQuery? Feb 28, 2024 pm 03:12 PM

      Wie verwende ich die PUT-Anfragemethode in jQuery? In jQuery ähnelt die Methode zum Senden einer PUT-Anfrage dem Senden anderer Arten von Anfragen, Sie müssen jedoch auf einige Details und Parametereinstellungen achten. PUT-Anfragen werden normalerweise zum Aktualisieren von Ressourcen verwendet, beispielsweise zum Aktualisieren von Daten in einer Datenbank oder zum Aktualisieren von Dateien auf dem Server. Das Folgende ist ein spezifisches Codebeispiel, das die PUT-Anforderungsmethode in jQuery verwendet. Stellen Sie zunächst sicher, dass Sie die jQuery-Bibliotheksdatei einschließen. Anschließend können Sie eine PUT-Anfrage senden über: $.ajax({u

      Mar 18, 2024 pm 02:10 PM

      Obwohl die allgemeine Funktionsweise heimischer Mobiltelefone sehr ähnlich ist, gibt es in einigen Details dennoch einige Unterschiede. Beispielsweise können verschiedene Mobiltelefonmodelle und Hersteller unterschiedliche Dual-SIM-Installationsmethoden haben. Erzhenwo 12Pro, ein neues Mobiltelefon, unterstützt auch Dual-SIM Dual Standby, aber wie soll Dual-SIM auf diesem Telefon installiert werden? Wie installiere ich Dual-SIM auf Realme 12Pro? Denken Sie daran, Ihr Telefon vor der Installation auszuschalten. Schritt 1: Finden Sie das SIM-Kartenfach: Suchen Sie das SIM-Kartenfach des Telefons. Normalerweise befindet sich das SIM-Kartenfach beim Realme 12 Pro an der Seite oder oben am Telefon. Schritt 2: Führen Sie die erste SIM-Karte mit einem speziellen SIM-Kartenstift oder einem kleinen Gegenstand in den Steckplatz im SIM-Kartenfach ein.

      jQuery-Tipps: Ändern Sie schnell den Text aller a-Tags auf der Seite jQuery-Tipps: Ändern Sie schnell den Text aller a-Tags auf der Seite Feb 28, 2024 pm 09:06 PM

      Titel: jQuery-Tipps: Ändern Sie schnell den Text aller Tags auf der Seite. In der Webentwicklung müssen wir häufig Elemente auf der Seite ändern und bedienen. Wenn Sie jQuery verwenden, müssen Sie manchmal den Textinhalt aller a-Tags auf der Seite gleichzeitig ändern, was Zeit und Energie sparen kann. Im Folgenden wird erläutert, wie Sie mit jQuery den Text aller Tags auf der Seite schnell ändern können, und es werden spezifische Codebeispiele angegeben. Zuerst müssen wir die jQuery-Bibliotheksdatei einführen und sicherstellen, dass der folgende Code in die Seite eingefügt wird: &lt

      Verwenden Sie jQuery, um den Textinhalt aller a-Tags zu ändern Verwenden Sie jQuery, um den Textinhalt aller a-Tags zu ändern Feb 28, 2024 pm 05:42 PM

      Titel: Verwenden Sie jQuery, um den Textinhalt aller Tags zu ändern. jQuery ist eine beliebte JavaScript-Bibliothek, die häufig zur Verarbeitung von DOM-Operationen verwendet wird. Bei der Webentwicklung müssen wir häufig den Textinhalt des Link-Tags (eines Tags) auf der Seite ändern. In diesem Artikel wird erläutert, wie Sie mit jQuery dieses Ziel erreichen, und es werden spezifische Codebeispiele bereitgestellt. Zuerst müssen wir die jQuery-Bibliothek in die Seite einführen. Fügen Sie den folgenden Code in die HTML-Datei ein:

      So erhalten Sie gefälschte zukünftige Kristallmünzen So erhalten Sie gefälschte zukünftige Kristallmünzen Mar 22, 2024 am 08:00 AM

      Viele Spieler möchten wissen, wie sie gefälschte zukünftige Kristallmünzen erhalten. Es gibt tatsächlich vier verschiedene Methoden, darunter den Kauf von Geschenkpaketen, das Erfüllen von Aufgaben, die Herstellung von Waren, die Erschließung von Land usw. Spieler können je nach Bedarf verschiedene Möglichkeiten wählen, um Kristallmünzen zu verdienen. Der konkrete Inhalt ist wie folgt: Schauen Sie sich diese Anleitung an, wie Sie gefälschte zukünftige Kristallmünzen erhalten. Fake-Future-Leitfaden: So erhalten Sie Fake-Future-Kristallmünzen 1. Kaufen Sie das Geschenkpaket-Einkaufszentrum, um das Kristallmünzen-Geschenkpaket zu kaufen. 2. Wird durch das Erledigen von Aufgaben sowie das Erledigen von Haupt- und Nebenaufgaben erhalten. 3. Produzieren Sie Waren in Ihrem Zuhause, um Kristallmünzen zu erhalten. 4. Bauland kann auch durch Bauland erworben werden, die Belohnung ist jedoch einmalig.

      So erhalten Sie Huang Rong im Handyspiel Shooting Condor So erhalten Sie Huang Rong im Handyspiel Shooting Condor Mar 27, 2024 pm 10:36 PM

      Das Condor-Handyspiel steht kurz vor der offiziellen Veröffentlichung. Spieler müssen zunächst die [NetEase Master]-APP herunterladen, dann dem [Condor Circle] beitreten und am Condor-Spiel teilnehmen: SSR Huang Rong wird kostenlos abgegeben. So erhalten Sie Huang Rong im Handyspiel Condor Shooting 1. Laden Sie zunächst die [NetEase Master]-APP herunter und treten Sie dann dem [Condor Shooting Circle] bei. 2. Gehen Sie zum Condor Shooting Circle, schieben Sie die Seite nach oben, um die Seite wie unten gezeigt anzuzeigen, und klicken Sie auf [Schatz schnitzen]. 3. Sie können auch auf [Diaobao-Minispiel: SSR Huang Rong kostenlos spielen] klicken, wie durch den Pfeil im Bild unten gezeigt. 4. Rufen Sie dann die Diaobao-Seite auf und klicken Sie unten auf [Yunyou Zhongdu]. Dies ist ein inaktives Gerät. Wählen Sie einfach die Zeit und die Richtung aus. 5. Fahren Sie mindestens sechs Mal umher und wählen Sie jedes Mal eine andere Zeit und Richtung. 6. Klicken Sie, um einen Anspruch geltend zu machen

      Wie kann man feststellen, ob ein jQuery-Element ein bestimmtes Attribut hat? Wie kann man feststellen, ob ein jQuery-Element ein bestimmtes Attribut hat? Feb 29, 2024 am 09:03 AM

      Wie kann man feststellen, ob ein jQuery-Element ein bestimmtes Attribut hat? Wenn Sie jQuery zum Betreiben von DOM-Elementen verwenden, stoßen Sie häufig auf Situationen, in denen Sie feststellen müssen, ob ein Element ein bestimmtes Attribut hat. In diesem Fall können wir diese Funktion einfach mit Hilfe der von jQuery bereitgestellten Methoden implementieren. Im Folgenden werden zwei häufig verwendete Methoden vorgestellt, um festzustellen, ob ein jQuery-Element über bestimmte Attribute verfügt, und um spezifische Codebeispiele anzuhängen. Methode 1: Verwenden Sie die Methode attr() und den Operator typeof //, um zu bestimmen, ob das Element ein bestimmtes Attribut hat

      See all articles