Javascript/jQuery Element untersuchen wie bei Firebug

...komplette Frage anzeigen

1 Antwort

was meinst du mit "wie in firebug"? du kannst dir so ziemlich alle Eigenschaften eines HTML elements ausgeben lassen, falls du das meinst. Was willst du denn erreichen?

In Firebug gibt es eine Funktion mit der man sich den HTML-Code eines Elements anzeigen lassen kann, wenn man mit der Maus drüberfährt. Ich würde gerne diese Funktion in einem Projekt von mir miteinfließen lassen. Die Firefox-Plugins und Addons sind ja in Javascript geschrieben, aber ich weiß nicht wie diese Funktion funktioniert. Dafür reichen meine Kenntnisse leider nicht aus.

0
@wiederverwendet

du kannst das machen, ist aber natürlich ein bisschen arbeit. das wäre mein ansatz: Du legst auf die elemente einen hover-listener. Darin setzt du an die Position deiner Maus einen Overlay-Block (

mit entsprechendem css), in den du den html-code des ausgewählten elements (je nach wunsch innerHTML oder outerHTML) lädst. Wenn du das mit jQuery (so in etwa $(...).text(elementHTML); ) machst, wird automatisch ein escaping durchgeführt, also die HTML-Tags usw. werden als text angezeigt und nicht vom browser geparst.
0
@bergerle

Interessanter Ansatz! Die Frage hierbei ist, ob man damit (wie FireBug) den lokalen Quellcode auch manipulieren könnte.

Zur Erklärung: Ziel ist, einen kleinen Webeditor zu bauen. Damit man schnell und einfach Designänderungen am lebenden Objekt (Website) demonstrieren kann, ohne dass Zugriff auf den eigentlichen Server besteht und man über einen Link auf das geänderte Design zugreifen kann. (Quellcode wird ganz simpel in einer txt.-Datei auf dem Webspace gespeichert.

0
@wiederverwendet

machbar ja, aber wird natürlich auch komplizierter. du kannst ja in dem overlay eine Textarea machen, in der du das HTML bearbeiten kannst. Das kannst du dann auch wieder mit jQuery zurück in das eigentliche Dokument schreiben.

Du könntest du übrigens auch überlegen, von jQuery auf angular.js umzusteigen. Braucht vielleciht etwas mehr Einarbeitung, ist aber auch sehr mächtig.

Allerdings klingt das jetzt so, al ob du den Text nicht nur in deinem Browser, sonder auf dem Server verändern willst, um den code der Seite anzupassen. Das kann allein mit Javascript nicht gemacht werden, da du damit ja nicht auf den Server zugreifst. Du könntest allerdings z.B. mit PHP einen entsprechenden Webservice basteln, den du per ajax-call aufrufst, um die Änderungen zu speichern.

0
@bergerle

Ich werde mal damit rumspielen. AngularJS ist mir bekannt und damit will ich demnächst auch anfangen. Mir geht es hierbei nicht darum, die Daten gleich auf dem Server zu ändern. Es soll vielmehr eine Vorlage sein, wie man es anpassen könnte. Also noch weit weg vom Deploy :)

Aber danke, du hast mir schon weitergeholfen. Manchmal braucht man eben eine kleine Denkhilfe

1

Was möchtest Du wissen?