Altiano Gerung
Altiano Gerung

Reputation: 854

structuring html/css/java script code from website to be more readable

this maybe a stupid question or something.. when i open google.com and see the 'page source', i see a lot of impossible-to-read-by-human kind of code..

Google (function(){window.google={kEI:'uS57VJ-SCNONuASrhYHwDA',kEXPI:'3300105,3300130,3300137,3300161,3310366,3310751,3312478,3700322,4010073,4011550,4011551,4011556,4011558,4011559,4016824,4019182,4020346,4020562,4021073,4021598,4022317,4022495,4023373,4023567,4023631,4023677,4023709,4024679,4024932,4024970,4025113,4025115,4025119,4025170,4025285,4025836,8300096,8500394,8500700,8500820,8500852,10200083,10200716,10200828,10200834,10200850',authuser:0,j:{en:1,bv:21,pm:'p',u:'e57ea291',qbp:0,rre:false},kSID:'uS57VJ-SCNONuASrhYHwDA'};google.kHL='en';})();(function(){google.lc=[];google.li=0;google.getEI=function(a){for(var b;a&&(!a.getAttribute||!(b=a.getAttribute("eid")));)a=a.parentNode;return b||google.kEI};google.https=function(){return"https:"==window.location.protocol};google.ml=function(){};google.time=function(){return(new Date).getTime()};google.log=function(a,b,d,e,k){var c=new Image,h=google.lc,f=google.li,g="",l=google.ls||"";c.onerror=c.onload=c.onabort=function(){delete h[f]};h[f]=c;d||-1!=b.search("&ei=")||(e=google.getEI(e),g="&ei="+e,e!=google.kEI&&(g+="&lei="+google.kEI));a=d||"/"+(k||"gen_204")+"?atyp=i&ct="+a+"&cad="+b+g+l+"&zx="+google.time();/^http:/i.test(a)&&google.https()?(google.ml(Error("a"),!1,{src:a,glmm:1}),delete h[f]):(c.src=a,google.li=f+1)};google.y={};google.x=function(a,b){google.y[a.id]=[a,b];return!1};google.load=function(a,b,d){google.x({id:a+m++},function(){google.load(a,b,d)})};var m=0;})();google.kCSI={};

bla.. bla.. bla..

the question is obvious.. is there any tool i can use to read this code more 'fun'? or at least more readable?

UPDATE: i want this enter image description here

to be looked like this:enter image description here

Upvotes: 0

Views: 685

Answers (3)

Altiano Gerung
Altiano Gerung

Reputation: 854

http://ctrlq.org/beautifier/ or http://jsbeautifier.org/

thank to @Patrick Evans , the man on the comment panel

Upvotes: 0

Abhishek Yadav
Abhishek Yadav

Reputation: 41

you can try the online editor such as www.textfixer.com/html/uncompress-html-code.php

Upvotes: 1

ianaya89
ianaya89

Reputation: 4233

Instead of looking at the page source use the chrome dev tools.

  1. Open the web site you want with chrome.
  2. Make a right click on it and select the option inspect element.
  3. When the tool is open take a look at the tab Elements, there you can see and handle de the DOM and you will see an HTML structure easy to read and follow.

Upvotes: 1

Related Questions