Простой способ сделать статическую копию веб-приложения для JSFiddle?

Question

У меня часто возникает проблема, когда я работаю над динамическим веб-приложением с тоннами интерфейсного или внешнего кода, и есть проблема с CSS, которая просто ускользает от меня, несмотря на час царапания моей головы. Я знаю, что StackOverflow мог бы решить эту проблему в секунду, и я хотел бы опубликовать его, но я либо должен

1. сделать приложение общественности вместе с шагами, чтобы воспроизвести состояние, или
2. утомительно выписывать DOM и активы (CSS) вместе с текущим состоянием.

Ничего особенного. Обратите внимание, что DOM динамически генерируется, поэтому «View Source» не будет его обрезать. Аналогично, CSS можно разложить по нескольким файлам, и я хотел бы просто захватить все это сразу.

Есть ли простой способ скопировать DOM и все CSS в виде одного файла, чтобы я мог вставить его в нечто вроде JSFiddle и быть в пути?

Answer 1

Самый быстрый способ получить все HTML на странице как есть, чтобы вставить это в адресной строке:

javascript:alert(document.body.outerHTML) 

Вы также можете использовать консоль, конечно, но выше, работает даже в старых IE и легче копировать/вставлять.

Я не думаю, что это хороший способ, чтобы получить CSS на всех, но вы можете попробовать использовать селектор JQuery или аналогичный, чтобы получить URL-адреса:

$('link[type="text/css"]') 
    .each(function(x, link){ 
    console.log(link.attributes.href.value)}); 

И загрузка и сцеплению CSS.