kostenloser Webspace werbefrei: lima-city


ZeilenNummer im laufen HTML anzeigen

lima-cityForumDie eigene HomepageHTML, CSS & Javascript

  1. Autor dieses Themas

    mukerbude

    Kostenloser Webspace von mukerbude

    mukerbude hat kostenlosen Webspace.

    Hallo,

    kennt Ihr einen Trick, oder eine kleine SoftWare die es ermöglicht, in einer selbst geschriebenen HTML-Datei, wenn diese in den Browser übertragen ist, dort die ZeilenNummern unter der Cursor-Position zu ermitteln?

    Danke
  2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

  3. witze-dschungel

    witze-dschungel hat kostenlosen Webspace.

    mukerbude schrieb:
    in einer selbst geschriebenen HTML-Datei, wenn diese in den Browser übertragen ist
    Also jede andere Webseite, die ein Browser anzeigt, mit dem Unterschied, dass hier kein PHP oder eine andere Skriptsprache verwendet wird.
    mukerbude schrieb:
    dort die ZeilenNummern unter der Cursor-Position zu ermitteln?
    Zeilennummern unter der Cursorposition? :confused:

    Meinst du, wenn du zum Beispiel einen Link mit dem Mauszeiger anwählst, dass dir angezeigt wird, in welcher Zeile vom HTML-Code das Anchor-Element definiert wurde? Du kannst die Entwicklertools nutzen (Rechtsklick --> Element untersuchen), aber damit kriegst du noch nicht die Zeilennummer.

    Klingt für mich gerade stark nach einem XYProblem. https://xyproblem.info/

    Was genau willst du erreichen, und wo kommst du gerade nicht weiter?

    Beitrag zuletzt geändert: 23.3.2023 21:23:32 von witze-dschungel
  4. Autor dieses Themas

    mukerbude

    Kostenloser Webspace von mukerbude

    mukerbude hat kostenlosen Webspace.

    Ich schreibe eine HTML-Datei mit Phase 5
    In Phase 5 kann man die Datei im ausgewählten Browser (Opera) starten, um zu kontrollieren ob alles passt
    Im Browser möchte ich mit dem Cursor die entsprechende Zeile im Programm anzeigen, oder auch nur die ZeilenNummer angezeigt bekommen

    Ich frage mich, warum jemand eine Frage negativ bewertet ?
    Die negative Bewertung wurde zurückgenommen?! Seltsame Allüren.


    - Im Prinzip würde mir so etwas simples genügen wie STRG-U, wenn dann im Quelltext die Zeile gekennzeichnet wäre, über der der Mauszeiger steht.

    - Eine andere Methode wäre die ZeilenNummern im Browser anzeigen zu lassen, geht das?
    In Opera habe dazu nichts gefunden.

    - Da es sich ausschließlich um meine eigenen HTMLs handelt könnte ein Programm den Job erledigen … ?

    - Im CSS gibt es eine Möglichkeit:
    Durch Formatierung der <code> Elemente, die innerhalb eines präformatierten Blocks der Klasse sourcecode stehen. Mit der Pseudoklasse :before kann man Inhalte generieren, die vor dem eigentlichen Element angezeigt werden.
    Leider zerstört bei 5 stelligen Zeilennummern deren Länge die Ansicht im Browser.



    Beitrag zuletzt geändert: 24.3.2023 21:40:10 von mukerbude
  5. witze-dschungel

    witze-dschungel hat kostenlosen Webspace.

    mukerbude schrieb:
    Im Browser möchte ich mit dem Cursor die entsprechende Zeile im Programm anzeigen, oder auch nur die ZeilenNummer angezeigt bekommen
    Dazu ist mir eine keine Möglichkeit bekannt. Vielleicht wäre das über eine Browser-Erweiterung möglich, die sich entsprechend in Phase5 integriert.
    mukerbude schrieb:
    Im Prinzip würde mir so etwas simples genügen wie STRG-U, wenn dann im Quelltext die Zeile gekennzeichnet wäre, über der der Mauszeiger steht.
    Vielleicht ist es zu einfach gedacht, aber du könntest direkt die Entwicklerkonsole mit der Maus oder der Tastatur kombiniert mit der Editor-Suche nutzen.

    1. Strg + Shift + C (Element untersuchen). Damit wird auch die aktuelle Mauszeigerposition in der Quelltextansicht berücksichtigt.
    2. Strg + C, um den Code in der Entwickler-Konsole zu kopieren. Alternativ auf die Code-Zeile Rechtsklick --> Kopieren --> Element kopieren.
    3. Alt + Tab, um zum Phase 5 Editor zu kommen, oder mit der Maus über die Taskleiste wechseln.
    4. In Phase 5 Strg + F, oder über das Menü die Suche starten.
    5. Text einfügen und Suche starten.

    Über die Suche müsste die richtige Zeile automatisch im Text-Editor angezeigt werden.

    Beitrag zuletzt geändert: 25.3.2023 22:47:59 von witze-dschungel
  6. Autor dieses Themas

    mukerbude

    Kostenloser Webspace von mukerbude

    mukerbude hat kostenlosen Webspace.

    @ witze-dschungel

    danke für Deine interessanten Ideen.
    Aber keine entspricht dem wonach ich suche.

    Nochmal ganz einfach.
    Sicher kennst Du pixie.exe, es ist eine kleine Soft die die Farben des Bildschirms unter dem Cursor anzeigt. So etwas in der Art stelle ich mir vor, zur Ermittlung der Programmzeilen einer WebSite.
  7. witze-dschungel

    witze-dschungel hat kostenlosen Webspace.

    Wenn ich das richtig sehe, kopiert pixie.exe auch nur die aktuelle Farbe in die Zwischenablage. Also nichts anders, was die Tastenkombination Strg + Shift + C und Strg + C im Browser mit HTML-Code erreicht.

    Um nochmal auf die Frage zurückzukommen, was du eigentlich erreichen möchtest (Problem X) statt deinem bisherigerigen Lösungsansatz (Problem Y): Du möchtest eine Änderung in deiner Seite durchführen. Wenn du eine Stelle im Browser siehst, die du ändern möchtest, willst du diese Stelle schnell im Code-Editor wiederfinden. Du könntest von Hand suchen, aber es würde schneller gehen, wenn diese Programmzeile automatisch hervorgehoben wird, richtig?

    Für mich klingt es nicht unbedingt danach, dass ein externes Programm notwendig ist. Manchmal gibt es nicht nur eine richtige Lösung für ein Problem.

    Beitrag zuletzt geändert: 26.3.2023 17:33:19 von witze-dschungel
  8. Autor dieses Themas

    mukerbude

    Kostenloser Webspace von mukerbude

    mukerbude hat kostenlosen Webspace.

    Hallo witze-dschungel
    du machst nichts anderes als, dass bereits gesagte zu wiederholen, damit vergeudest du deine und dazu noch meine Zeit.
    Es wäre wirklich nett etwas konstruktiveres zu erfahren als solche Allgemeinplätze:
    witze-dschungel schrieb:
    Für mich klingt es nicht unbedingt danach, dass ein externes Programm notwendig ist. Manchmal gibt es nicht nur eine richtige Lösung für ein Problem.



  9. witze-dschungel

    witze-dschungel hat kostenlosen Webspace.

    Ich weiß nicht, was du dir für eine Antwort erhoffst. Wenn es ein externes Programm sein soll, kannst du https://www.autohotkey.com/ ausprobieren und die eben genannten Shortcuts einprogrammieren.

    Beitrag zuletzt geändert: 28.3.2023 1:08:29 von witze-dschungel
  10. prinz-und-gloeckner

    prinz-und-gloeckner hat kostenlosen Webspace.

    Ist auch meine Beobachtung, daß das Unterfenster, welches aufklappt, wenn man ein Element inspizieren oder untersuchen (je nach Brauser und Version) will, so kommt man ohne Zeilennummer zum fraglichen Element, bekommt dies sogar in der Anzeige farblich markiert.
    So kann man schnell etwas finden, dort in dem Unterfenster auch direkt bearbeiten, was ich gelegentlich nutze, um pessimierte Seiten anderer Anbieter für mich zugänglich zu machen.

    Zeilennummern gibt es in der Quelltextanzeige, tja, die bekommt man aber wiederum nicht mit der Elementinspektion korreliert, nicht einmal bei SeaMonkey, welcher aus historischer Zeit noch einen Editor eingebaut hat.

    Das Fehlen der Zeilennummern bei diesem Inspektor wird gelegentlich damit begründet, daß man da eben nicht den Quelltext der Seite sieht, vielmehr eine Repräsentation des DOMs, früher hieß das Teil auch mal DOM-Inspektor.
    Daher kann man das für beliebige angezeigte Seiten dynamisch ändern, bekommt aber wohl erst einen dazu passend gebastelten Quelltext, wenn man die veränderte Seite anschließend wirklich abspeichert.
    Zu dem Zeitpunkt ist allerdings keine aktuell korrellierbare Zeilennummer mehr gegeben.

    Alternative: Über den DOM-Inspektor könnte man einen Marker einfügen, den Quelltext zum modifizierten DOM abspeichern, danach darin nach dem Marker suchen, auch wenig elegant, aber sollte gehen.
    Also ohne Zeilennummer sofort mit dem DOM-Inspektor etwas ändern oder herumsuchen scheint im Angebot zu sein.
    Sonst findet man dazu auch in Netz wenig, was helfen könnte, was über das hinausgeht, was hier bereits genannt wurde.



  11. bruchpilotnr1

    Kostenloser Webspace von bruchpilotnr1

    bruchpilotnr1 hat kostenlosen Webspace.

    mukerbude schrieb:
    Hallo,

    kennt Ihr einen Trick, oder eine kleine SoftWare die es ermöglicht, in einer selbst geschriebenen HTML-Datei, wenn diese in den Browser übertragen ist, dort die ZeilenNummern unter der Cursor-Position zu ermitteln?

    Danke


    OpenAI schreibt dazu folgendes:
    Ja, es gibt Möglichkeiten, in einer selbst geschriebenen HTML-Datei im Browser die Zeilennummern unter der Cursor-Position zu ermitteln. Allerdings erfordert dies in der Regel die Verwendung von JavaScript.

    Ein Ansatz besteht darin, den Event-Listener "mousemove" auf das Dokument zu setzen und die Position des Cursors relativ zur Seitenansicht zu ermitteln. Mit dieser Position können Sie dann die Position innerhalb des HTML-Dokuments bestimmen, indem Sie die Verschiebung des Viewports berücksichtigen.

    Hier ist ein einfacher Code, der Ihnen einen Eindruck davon gibt, wie dies umgesetzt werden könnte:
    <!DOCTYPE html>
    <html>
    <head>
      <meta charset="UTF-8">
      <title>Zeilennummern ermitteln</title>
      <style>
        #lineNumber {
          position: fixed;
          bottom: 10px;
          right: 10px;
          background-color: white;
          padding: 5px;
          border: 1px solid black;
        }
      </style>
    </head>
    <body>
      <pre id="code">
        Zeile 1
        Zeile 2
        Zeile 3
      </pre>
    
      <div id="lineNumber">Zeilennummer: </div>
    
      <script>
        document.addEventListener('mousemove', function(e) {
          var codeElement = document.getElementById('code');
          var lineNumberElement = document.getElementById('lineNumber');
    
          var lineHeight = parseInt(window.getComputedStyle(codeElement).lineHeight);
          var rect = codeElement.getBoundingClientRect();
    
          var lineNumber = Math.floor((e.clientY - rect.top) / lineHeight) + 1;
          lineNumberElement.textContent = 'Zeilennummer: ' + lineNumber;
        });
      </script>
    </body>
    </html>


    In diesem Beispiel wird das <pre>-Element verwendet, um den Code darzustellen. Der Event-Listener "mousemove" wird auf das Dokument angewendet und bei jedem Mausbewegungsereignis ausgelöst. Anschließend wird die Zeilennummer anhand der Mausposition und der Position des Code-Elements relativ zum Viewport berechnet.

    Die Zeilennummer wird dann in einem separaten <div>-Element mit der ID "lineNumber" angezeigt. Sie können das Styling des Elements anpassen, um es nach Ihren Wünschen zu gestalten.


    Quelle: https://chat.openai.com/
  12. Autor dieses Themas

    mukerbude

    Kostenloser Webspace von mukerbude

    mukerbude hat kostenlosen Webspace.

    Hammer gut !

    Werde das kleine Progrämmchen nachher ausprobieren und davon berichten.

    Besten Dank.

    P.S. Wie kann ich eine positive Bewertung schicken?
  13. bruchpilotnr1

    Kostenloser Webspace von bruchpilotnr1

    bruchpilotnr1 hat kostenlosen Webspace.

    mukerbude schrieb:
    Hammer gut !

    Werde das kleine Progrämmchen nachher ausprobieren und davon berichten.

    Besten Dank.

    P.S. Wie kann ich eine positive Bewertung schicken?


    Nun Bewertungen kann ich leider auch nicht mehr abgeben. Warum weiß ich leider nicht.

    Aber schön, dass ich dir mit ChatGPT helfen konnte auch wenn es nicht mein Wissen gewesen ist :biggrin:
  14. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

Login zum Webhosting ohne Werbung!