web-dev-qa-db-fra.com

Comment remplacer le texte de la chaîne JSON par un script utilisateur pour Greasemonkey

Je souhaite créer un script utilisateur pour Greasemonkey dans Firefox sans utiliser jQuery, qui peut remplacer l'ancien texte par un nouveau texte lorsque la page du site Web est chargée.

Code HTML:

..

window.app = profileBuilder({
..
    "page": {
        "btn": {
            "eye": "blue",
            "favorite_color": "blue",
            "gender": "male",
        },
    },
..
});

..

Remplacez "bleu" des yeux par "vert", "bleu" de couleur préférée par "rouge" et "mâle" par "femelle".

Lorsque la page sera chargée, je souhaite voir, par exemple, Vert (pas bleu) pour les yeux et Femme pour le sexe (pas les hommes).

Je suppose que je dois utiliser les fonctions suivantes:

GM_getValue()
GM_setValue()
JSON.parse()
JSON.stringify()

PS: le code JSON est directement dans la page et non dans le fichier (../code.json)

Code utilisateur:

// ==UserScript==
// @name        nemrod Test
// @namespace   nemrod
// @include     http*://mywebsite.com/*
// @version     1
// ==/UserScript==
var json = {"page": {"btn": {"eye": "blue","favorite_color": "blue","gender": "male",},},};
var stringified = JSON.stringify(json);
stringified = stringified.replace(/"eye": "blue"/gm, '"eye": "green"');
stringified = stringified.replace(/"favorite_color": "blue"/gm, '"favorite_color": "red"');
var jsonObject = JSON.parse(stringified);

Ça ne marche pas

Quelqu'un peut aider avec le bon code?

javascripthtmljsonreplaceuserscripts
9
nemrod

Premier stringify() votre JSON.

var stringified = JSON.stringify(json);

Ensuite, utilisez la fonction JavaScript String .replace().

stringified = stringified.replace('"eye": "blue"', '"eye": "green"');
stringified = stringified.replace('"gender": "male"', '"gender": "female"');

Maintenant, parse() votre JSON dans un objet.

var jsonObject = JSON.parse(stringified);

Maintenant, vous pouvez utiliser jsonObject pour ce que vous voulez.

EDIT: utilisez ces lignes à la place de la précédente .replace()s.

stringified = stringified.replace('"eye": "blue"', '"eye": "green"');
stringified = stringified.replace('"gender": "male"', '"gender": "female"');
11
Data2000

une procédure plus précise consisterait à utiliser une expression régulière. 

   stringified.replace(/"eyes":"blue"/gm, '"eyes":"blue"')

ainsi, vous savez que vous remplacez le bleu pour les yeux et non le bleu qui apparaît (comme la couleur préférée) . les options "g" et "m" pour expression régulière signifient global, ce qui entraînera la recherche de tous les résultats correspondants au cas où vous avez plus d’un "yeux" dans votre json) et "m" pour multiligne. dans le cas où votre chaîne est multiliné.

0
Gal Ziv

La manipulation de chaîne JSON peut être facilement réalisée avec JSON.parse() et JSON.stringify().

Un exemple est donné ci-dessous:

var Tweet = '{ "event": { "type": "message_create", "message_create": { "target": { "recipient_id": "xx_xx" }, "message_data": { "text": "xxx_xxx" } } } }';

var obj = JSON.parse(Tweet);
obj.event.message_create.target.recipient_id = Receiver;
obj.event.message_create.message_data.text = statusText;

var tweetString = JSON.stringify(obj);

Maintenant, la tweetString a l'objet JSON mis à jour.

0
Dhanya Gopinath

Première itération - JSON.stringify

var json = {"page": {"btn": {"eye": "blue","favorite_color": "blue","gender": "male"}}};

var replaceBy = {
  eye: function(value) {
    if (value == 'blue') {
      return 'green'
    }
  },
  favorite_color: function(value) {
    if(value == 'blue') {
      return 'red'
    }
  },
  gender: function(value) {
    if(value == 'male') {
      return 'female'
    }
  }
}

console.log(JSON.stringify(json, function(key, value) {
  if(replaceBy[key]) {
    value = replaceBy[key](value)
  }
  return value
}))

Deuxième itération - soyez gentil pour ES Harmony

  • add rule - ajoute une comparaison stricte
  • add matcher - ajoute n'importe quelle fonction responsable de la correspondance/remplacement des données 

'use strict'

var json = {
  "page": {
    "btn": {
      "eye": "Blue",
      "favorite_color": "blue",
      "gender": "male"
    }
  }
};

class Replacer {
  constructor() {
    this.matchers = []
  }

  addRule(rule, source, destination) {
    this.matchers.Push({
      type: rule,
      matcher: value => value == source ? destination : value
    })
    return this
  }

  addMatcher(type, matcher) {
    this.matchers.Push({
      type: type,
      matcher: matcher
    })
    return this
  }

  getByType(type) {
    return this.matchers.find(matcher => matcher.type === type)
  }

  applyRuleFor(type, value) {
    if (this.getByType(type)) {
      return this.getByType(type).matcher(value)
    }
  }

  static replaceWith(replacer) {
    return (key, value) => {
      if (replacer.getByType(key)) {
        value = replacer.applyRuleFor(key, value)
      }
      return value
    }
  }
}

console.log(JSON.stringify(json, Replacer.replaceWith(new Replacer()
  .addMatcher('eye', (value) => value.match(/blue/i) ? 'green' : value)
  .addRule('favorite_color', 'blue', 'red')
  .addRule('gender', 'male', 'female'))))

0
Krzysztof Safjanowski