Tool zum auslesen von Styles

[Horst Meier]

Hallo mir ist neulich folgende Idee gekommen und vielleicht gibt es dafür auch ein Tool.

Man könnte doch eine HTML Datei von einem Tool analysieren lassen und alle class und id Attribute in eine leere css Datei schreiben.

Gibt es soetwas? Oder hat jemand eine Idee wie sich soetwas am schnellsten umsetzen ließe?

[ChrisB]

Hi,

Man könnte doch eine HTML Datei von einem Tool analysieren lassen und alle class und id Attribute in eine leere css Datei schreiben.

Wozu?

Gibt es soetwas?

Ob in dieser simplen Form - k.A.

Oder hat jemand eine Idee wie sich soetwas am schnellsten umsetzen ließe?

DOM rekursiv durchlaufen, dabei alle IDs und class-Attributinhalte sammeln (letztere aufsplitten), merken - und dann in gewünschter Form/-atierung bspw. in einer Textarea oder einem PRE-Element ausgeben, von wo aus sie per C&P leicht übernommen werden können.

MfG ChrisB

[ChrisB]

P.S.:

DOM rekursiv durchlaufen, dabei alle IDs und class-Attributinhalte sammeln (letztere aufsplitten), merken - und dann in gewünschter Form/-atierung bspw. in einer Textarea oder einem PRE-Element ausgeben, von wo aus sie per C&P leicht übernommen werden können.

Das ganze per JavaScript natürlich.
Liesse sich bspw. als Bookmarklet ablegen, wenn man das häufiger braucht*.

* Wobei sich die Frage nach dem Wofür natürlich immer noch stellt :-)

MfG ChrisB

[Horst Meier]

Hi ok danke für die Antwort.

Das Wofür möchte ich Dir auch gerne erklären. Ich schreibe üblicherweise ertse die Struktur einer HTML Datein inklusive ids und class angaben die sind dann noch leer und völliog ungestylt. Nun muß ich die ids wieder in eine css datei eintragen damit die Seite entsprechend gestylt wird.

Da ich den Mist aber schon mal getippt habe wollte ich mir halt den Workflow erleichtern indem automatisch eine leere css angelegt wird glich mit ids und Klassen.

[ChrisB]

Hi,

Ich schreibe üblicherweise ertse die Struktur einer HTML Datein inklusive ids und class angaben die sind dann noch leer und völliog ungestylt.

Soweit normal.
Wo die Vergabe von IDs und Klassen sinnvoll ist, sollte sich idealer Weise komplett aus der Struktur der Daten ergeben.

Nun muß ich die ids wieder in eine css datei eintragen damit die Seite entsprechend gestylt wird.

Du musst sowieso eine ungefähre Idee davon haben, welche Elemente du formatieren willst. Wenn du die hast, dann hast du aber eigentlich auch schon im Kopf, welche ID und welche Klassen sie ggf. haben, bzw. wie in etwa ihre Beziehung zu anderen Elementen im DOM aussieht, um sie darüber möglichst sinnvoll und performant zu selektieren.

Da ich den Mist aber schon mal getippt habe wollte ich mir halt den Workflow erleichtern indem automatisch eine leere css angelegt wird glich mit ids und Klassen.

Wenn du wirklich in deinem Stylesheet lediglich die ganz simplen Selektoren für ID und Klasse einsetzt, und damit auch noch zu wirklich jeder im HTML vorkommenden ID und Klasse eine Regel bastelst - dann machst du m.E. etwas falsch.

MfG ChrisB

[Olaf Schneider]

Hallo,

ich habe vor kurzen eine Teilaufgabe davon gemacht, weil ich eine Liste aller im html verwendeten Klassen innerhalb eines Projektes haben wollte:

  
classes = []  
  
dir = File.join(File.dirname(__FILE__), 'pfad/zu/den/dateien/*.html')  
  
files = Dir.glob(dir).each do |file|  
  IO.foreach file do |line|  
    line.scan(/class="([^"]+)"/).each do |class_string|  
      classes |= class_string[0].split(' ')  
    end  
  end  
end  
  
classes.sort.each do |class_name|  
  print ".#{class_name}\n"  
end  

Die Sprache ist Ruby. Das Script behandelt nicht alle möglichen Fälle. Es geht zum Beispiel davon aus, dass der Inhalt des class-Attributs in einer Zeile steht und mit „"“ umgeben ist.

Auf so eine Art automatisch Default-css-Dateien zu erzeugen halte ich allerdings für eine eher unsinnige Idee.

Gruß
Olaf

[Beat]

Hallo mir ist neulich folgende Idee gekommen und vielleicht gibt es dafür auch ein Tool.
Man könnte doch eine HTML Datei von einem Tool analysieren lassen und alle class und id Attribute in eine leere css Datei schreiben.

Das, was beim Browser ankommt, mit JS...
Man kann sich also immer eine Subset des Namensraums zusammensammeln.
Und dann die Frage, will man JS postprocessed sammeln oder preprocessed. JS erzeugt ja auch Klassen.

Aber das wird auch Flickwerk bleiben, denn viele Id's werden dynamisch erstellt und sind eigentlich nicht für denn CSS Missbrauch vorgesehen.

Bei Klassen gilts wieder zu beachten:
class="abstract article"
Was genau soll jetzt gesammelt werden? die tokens oder die Kombination?

Gibt es soetwas? Oder hat jemand eine Idee wie sich soetwas am schnellsten umsetzen ließe?

Ich würde vorschlagen, du meldest deine Variablen in einer Datenbank an, bevor du sie verwendest.
Das hat dann viele potentielle Verwendungszwecke, nicht zuletzt die Komprimierung sprechender Variablen zu Chicken-Versions.

mfg Beat