web-dev-qa-db-fra.com

Javascript/Chrome - Comment copier un objet de l'inspecteur Webkit en tant que code

Je fais une déclaration console.log dans mon javascript afin de pouvoir enregistrer un objet javascript. Je me demande s'il y a un moyen, une fois que cela est fait - de copier cet objet sous forme de code javascript. Ce que j'essaie de faire est de convertir un objet créé avec ajax pour analyser un flux XML en un objet JavaScript statique afin qu'un fichier puisse être exécuté localement, sans serveur. J'ai inclus une capture d'écran de l'objet dans la fenêtre de l'inspecteur Chrome afin que vous puissiez voir ce que j'essaie de faire.enter image description here

javascriptjquerygoogle-chromeobjectwebkit
296
mheavers

  1. Cliquez avec le bouton droit sur un objet dans la console de Chrome et sélectionnez Store as Global Variable dans le menu contextuel. Il renverra quelque chose comme temp1 en tant que nom de variable.

  2. Chrome possède également une méthode copy(). copy(temp1) dans la console doit donc copier cet objet dans votre presse-papiers.

 Copy Javascript Object in Chrome DevTools

Note sur les objets récursifs: Si vous essayez de copier un objet récursif, vous obtiendrez [object Object]. C'est à prévoir.

750
kevnk

Essayez JSON.stringify() . Copiez la chaîne résultante.

45
Salman A

Vous pouvez copier un objet sur votre presse-papiers à l’aide de copy (JSON.stringify (Nom_Objet)); dans la console.

Par exemple: - Copiez et collez le code ci-dessous dans votre console et appuyez sur Entrée. Maintenant, essayez de le coller (ctrl + V) quelque part ailleurs et vous obtiendrez {"name": "Daniel", "age": 25}

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

copy(JSON.stringify(profile));
25
Sudharshan

Vous pouvez maintenant accomplir cela dans Chrome en cliquant avec le bouton droit de la souris sur l'objet et en sélectionnant "Stocker en tant que variable globale": http://www.youtube.com/watch?v=qALFiTlVWdg

 enter image description here

23
David Calhoun

Suivez les étapes suivantes: 

  1. Exportez l'objet avec console.log à partir de votre code, comme suit: console.log (myObject)
  2. Faites un clic droit sur l'objet et cliquez sur "Stocker en tant qu'objet global". Chrome afficherait le nom de la variable à ce stade. Supposons qu'il s'appelle "temp1".
  3. Dans la console, tapez: JSON.stringify(temp1).
  4. À ce stade, vous verrez l'objet JSON entier en tant que chaîne que vous pouvez copier/coller.
  5. Vous pouvez utiliser des outils en ligne tels que http://www.jsoneditoronline.org/ pour personnaliser votre chaîne à ce stade.
9
sufinawaz

Si vous avez envoyé l'objet via une demande, vous pouvez le copier à partir de l'onglet Chrome -> Réseau. 

Request Payload -> Voir la source

enter image description here

enter image description here

7
Christopher Marshall

L'utilisation de "Stocker en tant que variable globale" fonctionne, mais elle ne récupère que l'instance finale de l'objet, et non le moment où l'objet est en cours de journalisation (car vous souhaiterez probablement comparer les modifications apportées à l'objet à mesure qu'elles se produisent). Pour obtenir l'objet au moment exact de sa modification, j'utilise cette ...

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

Appelez ça comme si ...

logObject(puzzle);

Vous voudrez peut-être supprimer la regex .replace (/./ g, ",\n") si vos données contiennent des virgules.

0
HoldOffHunger

Cela devrait aider à structurer les objets profonds en omettant les objets Window et Node récursifs.

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;
  }, ' ');
}
0
dummker

clic droit sur les données que vous souhaitez stocker

  • Tout d'abord, faites un clic droit sur les données que vous souhaitez stocker -> sélectionnez "Stocker en tant que variable globale". Et la nouvelle variable temporaire apparaît comme ci-dessous: (variable temp3): ne nouvelle variable temporaire apparaît dans la console
  • Deuxième copie de la commande d’utilisation (nom_variable_temp), comme dans l’image: entrez la description de l’image ici Après cela, vous pouvez coller les données où vous le souhaitez. espérons utile /
0
Neo_

Alors,. J'ai eu ce problème, sauf que j'ai [objet objet]

Je suis sûr que vous pourriez le faire avec la récursivité, mais cela a fonctionné pour moi:

Voici ce que j'ai fait dans ma console:

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);

Puis collez dans votre éditeur.

0
twalow