Karl Heinz: Wie Code Fragment übersichtlich darstellen

Hallo,

teilweise findet man im Quellcode von Webseiten aber auch in diversen Anleitungen unheimlich unübersichtliche Code Fragmente z.B. JavaScript, html oder auch Programmiersprachen.

Gibt es eine Möglichkeit diese unübersichtlichen Code-Fragmente in eine Software zu packen, z.B. einen Editor wie Geany oder Notepad++, dann eine Tastkombination zu betätigen so das der Code übersichtlich mit Zeilenumbrüchen und Einrückungen dargestellt wird?

Das wäre mega hilfreich.

Ich möchte z.B. folgende sehr lange Zeile übersichtlich darstellen ohne das alles händisch machen zu müssen:

<script type="text/javascript" src="//widget.mango-office.com/js/c-t-w.min.js"></script><div class="m-call-tracking-widget" data-settings='{"id":55}'></div><script type="application/javascript">!function(t,e){for(var i=document.getElementsByClassName(t),n=0;n<i.length;n++){var r=i[n];if("true"!=r.getAttribute("init")){var a=new MCTWidget({host:e,elem:r});a.initWidget(),r.setAttribute("init","true")}}}("m-call-tracking-widget", window.location.protocol + "//widget.mango-office.com");</script>
  1. Tach!

    teilweise findet man im Quellcode von Webseiten aber auch in diversen Anleitungen unheimlich unübersichtliche Code Fragmente z.B. JavaScript, html oder auch Programmiersprachen.

    Ja, die wurden zusammengepackt, um die zu transportierende Große zu verringern.

    Gibt es eine Möglichkeit diese unübersichtlichen Code-Fragmente in eine Software zu packen, z.B. einen Editor wie Geany oder Notepad++, dann eine Tastkombination zu betätigen so das der Code übersichtlich mit Zeilenumbrüchen und Einrückungen dargestellt wird?

    Ja, Beautifier oder Reformatter können jeden Code lesbar formatieren. Meist braucht man dazu aber Ahnung von der Programmiersprache, und dann bekommen das die eierlegenden Wollmilchsau-Editoren weniger gut hin als spezialisierte Entwicklungsumgebungen.

    Das wäre mega hilfreich.

    Bedingt. Da werden oft nicht nur Whitespaces entfernt, auch Variablennamen werden so weit wie möglich verkürzt, so dass du am Ende zwar den Code siehst, aber ohne sprechende Variablennamen Mühe haben wirst, ihn nachzuvollziehen und zu verstehen.

    Ich möchte z.B. folgende sehr lange Zeile übersichtlich darstellen ohne das alles händisch machen zu müssen:

    <script type="text/javascript" src="//widget.mango-office.com/js/c-t-w.min.js">

    Zumindest den Code in dieser Datei könnte es vielleicht auch in einer Nicht-min-Version geben, die dann eben nicht minifiziert wurde. Wenn es denn Open Source ist.

    dedlfix.

  2. Ergebnis mit XMLTools- und JSTools-Plugins in Notepad++:

    < script type = "text/javascript" src = "//widget.mango-office.com/js/c-t-w.min.js" / >

     < div class = "m-call-tracking-widget" data - settings = '{"id":55}' /  >
     < script type = "application/javascript" > !function (t, e) {
    for (var i = document.getElementsByClassName(t), n = 0; n < i.length; n++) {
    	var r = i[n];
    	if ("true" != r.getAttribute("init")) {
    		var a = new MCTWidget({
    				host: e,
    				elem: r
    			});
    		a.initWidget(),
    		r.setAttribute("init", "true")
    	}
    }
    

    } ("m-call-tracking-widget", window.location.protocol + "//widget.mango-office.com"); < / script >

    1. Hallo,

      Ergebnis mit XMLTools- und JSTools-Plugins in Notepad++:

      oder alternativ, wenn es nicht so oft vorkommt einen Onlinegenerator benutzen.

      Gruss
      Henry

  3. Du denkst wohl auch, das Internet ist ein Selbstbedienungsladen!? Und erwartest dann auch noch Unterstützung!? Das ist ja sowas von dreist, mir fehlen die Worte!

    1. Das ist nicht meine -1…

      Nicht jeder, der fremden Code verstehen will, klaut ihn auch gleich. Manchmal will man auch einfach nur herauskriegen, warum ein Aufruf den man gemacht hat nicht funktioniert.

      Rolf

      1. Da wird der Autor kontaktiert und fertig und nichts Anderes. Oh mann, was ist bloß aus diesem Forum geworden!

        MfG

  4. Öffne die Seite mit Chrome, geh zu "Sources", öffne die entsprechende Quelle, und dann guck mal unter den Zeilennummern. Da steht sowas wie

    {} Line y, Column x

    Klicke mit der Ratte auf das {}

    Klappt auch mit diesem Forum - aus den 10 minifizierten Zeilen von assets/application*.js werden dann knapp 14000.

    Rolf