Inhaltsverzeichnis
Chrome/Edge Developer Tools Code Snippets verwenden um Page Variablen anzuzeigen
Gelegentlich ist es recht prakatisch den Wert aller Formualar Variablen auf der Seite zu kennen.
Dazu gibt es diverse Plugins wie das Plugin von Matt Mulvaney.
Was aber wenn keine Plugins erlaubt sind und Google Chrome überhaupt nicht verwendet werden darf?
In der Console lasse sich einfach ja auch die Werte der Page Items ausgeben.
Wie:
console.log('Code Snippet to show all form elements') var lpad = (str,pad,len) => { while(str.length < len) str = pad + str; return str; } var rpad = (str,pad,len) => { while(str.length < len) str = str+pad; return str; } var allForms; allForms=document.forms; for (let f = 0; f < allForms.length; f++) { console.log(allForms[f].name); console.log(' --- > elements'); [...allForms[f].elements].forEach(item => { var log_str = ' '; if (item.name) { log_str = ' +Type ::' + rpad(item.type,' ',15) + ' Name :: ' + rpad(item.name,' ',35) + ' Value :: ' + item.value console.log(log_str); } } ); }
Das aber jedes mal neu einzutippen/kopieren wäre aber auch umständlich.
Code Snippets
In den Developer Tools beider Browser (Edge und Chrome) lassen sich Scripte fest hinterlegen und bei Bedarf aufrufen.
Nach dem Starten der Developer Tools mit F12 oder Shift+CTRL+J unter „Source/Filesystem/Snippets“ obigen Code hinterlegen.
Per Tastatur aufrufen
Command Menü in den Developer Tools öffnen mit STRG+O und mit ! und den Scriptname das ganze aufrufen.
Weitere gute Beispiele
Formualare auswerten ⇒ https://github.com/bgrins/devtools-snippets/blob/master/snippets/formcontrols/formcontrols.js
viele Weitere Beispiele ⇒ https://bgrins.github.io/devtools-snippets/