JavaScript / Chrome - jak skopiować obiekt z inspektora Webkit jako kod


491

Robię instrukcję console.log w moim javascript, aby zarejestrować obiekt javascript. Zastanawiam się, czy jest jakiś sposób, aby to zrobić - skopiować ten obiekt jako kod javascript. To, co próbuję zrobić, to przekonwertować obiekt utworzony za pomocą ajax w celu parsowania kanału XML do statycznego obiektu javascript, aby plik mógł działać lokalnie, bez serwera. Dodałem zrzut ekranu obiektu w oknie inspektora chrome, abyś mógł zobaczyć, co próbuję zrobić.wprowadź opis zdjęcia tutaj


1
Spróbuj użyć Firefoxa i opcji .toSource (). To łatwiejsze
chepe263

Odpowiedzi:


1245
  1. Kliknij prawym przyciskiem myszy obiekt w konsoli Chrome i wybierz Store as Global Variablez menu kontekstowego. Zwróci coś takiego temp1jak nazwa zmiennej.

  2. Chrome ma również copy()metodę, więc copy(temp1)w konsoli należy skopiować ten obiekt do schowka.

Skopiuj obiekt Javascript w Chrome DevTools

Uwaga na temat obiektów rekurencyjnych: Jeśli spróbujesz skopiować obiekt rekurencyjny, otrzymasz [object Object]. Wyjściem jest to copy(JSON.stringify(temp1)), że obiekt zostanie w pełni skopiowany do twojego schowka jako prawidłowy JSON, więc będziesz mógł go sformatować według własnego uznania, używając jednego z wielu zasobów.


3
powrót niezdefiniowany w chrome Wersja 49.0.2623.87 (64-bit)? dlaczego>
Pardeep Jain,

10
@PardeepJain - jest to oczekiwane od metody copy (), ponieważ nie ma nic do zwrócenia. Dane powinny znajdować się w schowku.
Carl

35
To po prostu daje [object Object]mi.
Ullallulloo

1
@Ullallulloo spróbuj wylogować się z JSON.stringify w następujący sposób: stackoverflow.com/a/4293047/622287
kevnk

3
działa tylko wtedy, gdy masz płytki obiekt JS, jeśli masz rekurencyjny obiekt głęboki, to dostaniesz [Object Object] - to jest oczekiwane
Marwen Trabelsi

62

Spróbować JSON.stringify(). Skopiuj wynikowy ciąg. Nie działa z obiektami zawierającymi odwołania cykliczne.


7
Nie wiem, jak to by działało, chyba że zmodyfikujesz kod, który go rejestruje.
iConnor,

16
RozumiemTypeError: Converting circular structure to JSON
Tony Brasunas

40

Możesz skopiować obiekt do schowka za pomocą copy (JSON.stringify (Object_Name)); w konsoli.

Np .: - Skopiuj i wklej poniższy kod w konsoli i naciśnij ENTER. Teraz spróbuj wkleić (CTRL + V dla Windows lub CMD + V dla Mac) to gdzie indziej, a otrzymasz {"name": "Daniel", "age": 25}

var profile = {
    name: "Daniel",
    age: 25
};

copy(JSON.stringify(profile));

14
Nie działa z węzłami DOM, oknem ani innymi obiektami o okrągłym
kształcie

Zdecydowanie najłatwiejsze rozwiązanie dla dużego, ale prostego obiektu.
Hersheezy,

najłatwiejsze rozwiązanie
Anandhukrishna VR

26

Możesz to teraz zrobić w Chrome, klikając obiekt prawym przyciskiem myszy i wybierając „Zapisz jako zmienną globalną”: http://www.youtube.com/watch?v=qALFiTlVWdg

wprowadź opis zdjęcia tutaj


2
Od wersji 39.0.2171.95 opcja „Zapisz jako zmienną globalną” nie jest dostępna podczas inspekcji urządzeń z Androidem za pomocą Chrome.
Walter Roman

1
@David Calhoun, głosowałem za twoją odpowiedzią. Wygląda na to, że Twoja odpowiedź została opublikowana 12 czerwca 2014 r., A ta zaakceptowana to 5 sierpnia 2014 r., W dużej mierze biorąc dokładnie to, co miałeś. Muszę przyznać, że wspomina o temp1, gdzie twoja odpowiedź pokazuje go tylko w twoim filmie, więc może dlatego druga odpowiedź została zaakceptowana. Wszystkiego najlepszego.
PatS

13

Wykonaj następujące kroki:

  1. Wyjmij obiekt z plikiem console.log ze swojego kodu, na przykład: console.log (myObject)
  2. Kliknij obiekt prawym przyciskiem myszy i kliknij „Zapisz jako obiekt globalny”. W tym momencie Chrome wypisuje nazwę zmiennej. Załóżmy, że nazywa się to „temp1”.
  3. W konsoli wpisz: JSON.stringify(temp1).
  4. W tym momencie zobaczysz cały obiekt JSON jako ciąg, który możesz skopiować / wkleić.
  5. Możesz użyć narzędzi online, takich jak http://www.jsoneditoronline.org/, aby w tym momencie upiększyć swój ciąg.

Krok z JSON.stringify (temp1) może mieć wpływ na długotrwałe wykonanie, jeśli obiekt jest duży.
heroina

@JoeTidee Miałem ten sam problem, ale utworzyłem debuggerinstrukcję, a następnie odzyskałem swój var bezpośrednio z konsoli w punkcie przerwania.
Tony Brasunas,


0

Używanie opcji „Zapisz jako zmienną globalną” działa, ale pobiera tylko ostatnią instancję obiektu, a nie moment, w którym obiekt jest rejestrowany (ponieważ prawdopodobnie chcesz porównać zmiany w obiekcie w miarę ich występowania). Aby uzyskać obiekt dokładnie w momencie modyfikacji, używam tego ...

function logObject(object) {
    console.info(JSON.stringify(object).replace(/,/g, ",\n"));
}

Nazwij to tak ...

logObject(puzzle);

Możesz usunąć regex .replace (/./ g, ", \ n"), jeśli twoje dane zawierają przecinek.


0

Więc,. Miałem ten problem. z wyjątkiem tego, że mam [obiekt obiektu]

Jestem pewien, że możesz to zrobić za pomocą rekurencji, ale to zadziałało dla mnie:

Oto, co zrobiłem w konsoli:

var object_that_is_not_shallow = $("all_obects_with_this_class_name");
var str = '';
object_that_is_not_shallow.map(function(_,e){
    str += $(e).html();
});
copy(str);

Następnie wklej do swojego edytora.


0

Powinno to pomóc skreślić głębokie obiekty, pomijając rekurencyjne Windowi Nodeobiekty.

function stringifyObject(e) {
  const obj = {};
  for (let k in e) {
    obj[k] = e[k];
  }

  return JSON.stringify(obj, (k, v) => {
    if (v instanceof Node) return 'Node';
    if (v instanceof Window) return 'Window';
    return v;
  }, ' ');
}


Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.