Ankündigung

Einklappen
Keine Ankündigung bisher.

jQuery: p:first-letter als String

Einklappen

Neue Werbung 2019

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • jQuery: p:first-letter als String

    Hi,


    Möchte den ersten Buchstabe des ersten Absatzes als String "extrahieren"
    PHP-Code:
    $(document).ready(function(){

        var 
    el = $('p:first-child:first-letter');
           
    alert(el);
    }); 
    er gibt mir dort [object Object] aus, doch wie komme ich an den "content"?
    Meine Versuche:
    PHP-Code:
    $('p:first-child:first-letter').text() 
    PHP-Code:
    $('p:first-child:first-letter').text().charAt(0
    PHP-Code:
    $('p:first-child:first-letter').html() 
    PHP-Code:
    $('p:first-child:first-letter')[0
    ...doch ich bekomm entweder 'undefined' oder 'null'

    was mach ich falsch? Funktioniert der Selector nicht?

  • #2
    Sind und Zweck der $-Funktion ist es, Referenzen auf HTMLElement-Objekte zurückzugeben - ein Textknoten oder gar der erste Buchstabe ist aber kein solches, also wird das so vermutlich nicht funktionieren.

    Den reinen Textinhalt eines Elements kannst du aber im IE über die Eigenschaft innerText ermitteln, und in Gecko-Browsern über textContent - die anderen relevanten Browser werden vermutlich mindestens eins von beidem auch unterstützen, musst du aber ausprobieren.
    [SIZE="1"]RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?[/SIZE]

    Kommentar


    • #3
      ok, Referenz auf HTML-Object aber wie schau das dann im Code aus?
      PHP-Code:
      $('p:first-child:first-letter').innerText() 
      oder
      PHP-Code:
      $('p:first-child:first-letter').innerContent() 
      geht ja auch nicht?

      Ich möchte ja durch die Referenz an eine String kommen. Das ist die Frage!!

      Kommentar


      • #4
        Die Referenz auf das p-Element ermittelst du natürlich ohne die Pseudo-Klassen.

        (Btw., hast du nur ein p-Element im Dokument? Sonst sollte ja wohl klar sein, dass du zum Zugriff auf die einzelnen Elemente eine Schleife brauchst.)

        Und der Unterschied zwischen Eigenschaften und Methoden sollte doch wohl hoffentlich auch klar sein.
        [SIZE="1"]RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?[/SIZE]

        Kommentar


        • #5
          ne Methode:
          PHP-Code:
          car.drive() 
          PHP-Code:
          s.toString(); 
          ne Eigenschaft:
          PHP-Code:
          car.color blue
          Die Referenz auf das p-Element ermittelst du natürlich ohne die Pseudo-Klassen.
          .. wusste ich nicht? Nun kommt zumindest etwas raus mit:
          PHP-Code:
              var el = $('p');
              var 
          txt el.text();
              var 
          str txt.toString();
              
          alert(txt); 
          ..nur lässt sich der Text nicht in einen String umwandeln bzw. hat die Methode 'charAt()'
          bzw. 'toString()' keine Auswirkung?

          Kommentar


          • #6
            Zitat von Circushund Beitrag anzeigen
            Nun kommt zumindest etwas raus
            Und was?

            ..nur lässt sich der Text nicht in einen String umwandeln bzw. hat die Methode 'charAt()' bzw. 'toString()' keine Auswirkung?
            Was genau, haben die keine Auswirkung (was auch immer das bedeuten mag), oder gibt es Fehler beim Versuch, sie aufzurufen?
            (Wo du die Fehlerkonsole findest, weisst du hoffentlich.)
            [SIZE="1"]RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?[/SIZE]

            Kommentar


            • #7
              Zitat von Circushund Beitrag anzeigen
              PHP-Code:
                  var str txt.toString();
                  
              alert(txt); 
              ..nur lässt sich der Text nicht in einen String umwandeln bzw. hat die Methode 'toString()' keine Auswirkung?
              doch die toString() hat eine auswirkung, nur von der siehst hier nichts du gibst immer noch txt aus wobei du txt an str übergibst
              apt-get install npm -> npm install -g bower -> bower install <package> YOLO [URL]https://www.paypal.me/BlackScorp[/URL] | Mein Youtube PHP Kanal: [url]https://www.youtube.com/c/VitalijMik[/url]

              Kommentar


              • #8
                achne, jetzt gehts
                PHP-Code:
                $(document).ready(function(){
                    var 
                el = $('p');
                    var 
                txt el.text();
                    
                alert(txt.charAt(0));
                }); 
                Ausgabe: 'E', der Erste Buchstabe meines Paragraphs.

                Ok zu Erklärung: Ich möchte mit jQuery ein Inital erzeugen. Aber eben nur (so wie es üblich ist) im ersten <p> und dort beim ersten Buchstaben: ':first-letter'.

                Warum ich den ersten Buchstabe als String möchte?
                Um damit ein Bild zu laden, zB "A.png" oder "B.png" oder um die Versetzung eines Sprites mittels eines assoziativen Arrays zu ermitteln:
                Code:
                offset[myString] = -12;
                ..oderso? ... kenn mich mit Javascript überhaupt nicht aus, deshalb stell ich auch so Basic-Fragen, hoffe oder denke aber, das javascript Assoziative Arrays hat oder??

                Kommentar


                • #9
                  Zitat von BlackScorp Beitrag anzeigen
                  doch die toString() hat eine auswirkung, nur von der siehst hier nichts du gibst immer noch txt aus wobei du txt an str übergibst
                  ja stimmt, mein Fehler.

                  Kommentar


                  • #10
                    Zitat von Circushund Beitrag anzeigen
                    hoffe oder denke aber, das javascript Assoziative Arrays hat oder??
                    SELFHTML: JavaScript / Objektreferenz / Array

                    ne JS hat keine Assoziative Arrays

                    Im Gegensatz zu anderen Programmiersprachen gibt es in JavaScript keine assoziativen Arrays.
                    apt-get install npm -> npm install -g bower -> bower install <package> YOLO [URL]https://www.paypal.me/BlackScorp[/URL] | Mein Youtube PHP Kanal: [url]https://www.youtube.com/c/VitalijMik[/url]

                    Kommentar


                    • #11
                      Zitat von Circushund Beitrag anzeigen
                      hoffe oder denke aber, das javascript Assoziative Arrays hat oder??
                      Nein - aber Objekte lassen sich in der gewünschten Weise nutzen.
                      [SIZE="1"]RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?[/SIZE]

                      Kommentar


                      • #12
                        ui?
                        dann muss man ein Array und Object erzeugen und darüber dann auf die Eigenschaften zugreifen?

                        PHP-Code:

                        Mitarbeiter
                        [0] = new Object();
                        Mitarbeiter[0]["Name"] = "Müller";
                        Mitarbeiter[0]["Vorname"] = "Hans";
                        Mitarbeiter[0]["Wohnort"] = "Dresden" 

                        Kommentar


                        • #13
                          Das Array dient in dem Beispiel nur dazu, mehrere Objekte parallel zu verwalten.
                          Wenn du das nicht brauchst, kannst du auch direkt mit einem Objekt arbeiten, ohne drumherum gepacktes Array.
                          [SIZE="1"]RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?[/SIZE]

                          Kommentar


                          • #14
                            ja danke euch, ich glaub ich hab da schon ein Artikel gefunden
                            [url=http://www.learningjquery.com/2006/12/multiple-fancy-drop-caps]Multiple Fancy Drop Caps

                            Kommentar

                            Lädt...
                            X