Как я могу заменить текст в строке JSON пользовательским скриптом для Greasemonkey

Я хочу создать пользовательский скрипт для Greasemonkey в Firefox без использования jQuery, который может заменить старый текст новым текстом при загрузке страницы веб-сайта.

HTML-код:

..

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

..

Замените «голубой» глаз на «зеленый», «голубой» любимого цвета на «красный», а «мужской» на «женский».

Когда страница будет загружена, я хочу видеть, например, зеленый (не синий) для глаз и женский пол (не мужской).

Думаю, мне нужно использовать следующие функции:

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

PS: код JSON находится прямо на странице, а не в файле (../code.json)

Код пользовательского скрипта:

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

это не работает

Может кто-нибудь помочь с правильным кодом?


javascript json html replace userscripts
person nemrod    schedule 01.02.2015    source источник
comment
это часть вашего скрипта или самой страницы?   -  person Vishal Sharma    schedule 01.02.2015
comment
Что вы пробовали и почему, по вашему мнению, вам нужно использовать эти функции?   -  person Paul    schedule 01.02.2015
comment
@vishalsharma Эта часть находится на самой странице.   -  person nemrod    schedule 01.02.2015
comment
@paul Потому что я посмотрел в Интернете?   -  person nemrod    schedule 01.02.2015
comment
это просто объект, поэтому вы можете использовать unsafeWindow.page.btn.eye = green;   -  person Vishal Sharma    schedule 01.02.2015
comment
@vishalsharma Не работает, конечно, я включил (предоставить unsafeWindow) в своем пользовательском скрипте.   -  person nemrod    schedule 01.02.2015

Ответы (4)


arrow_upward
15
arrow_downward

Сначала stringify() ваш JSON.

var stringified = JSON.stringify(json);

Затем используйте функцию .replace() JavaScript String.

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

Теперь parse() преобразуйте ваш JSON в объект.

var jsonObject = JSON.parse(stringified);

Теперь вы можете использовать jsonObject для всего, что захотите.

РЕДАКТИРОВАТЬ: используйте эти строки вместо предыдущих .replace()s.

stringified = stringified.replace('"eye": "blue"', '"eye": "green"');
stringified = stringified.replace('"gender": "male"', '"gender": "female"');
person Anirudh Ajith    schedule 01.02.2015
comment
Могу ли я использовать регулярное выражение? Например, /eye: (d+)/g заменяет eye: green, потому что если у меня есть любимый_цвет: синий, мы можем видеть 2 раза один и тот же цвет. - person nemrod; 01.02.2015
comment
Вы могли бы, но я думаю, что функция .replace() String сейчас более проста, поскольку она в любом случае предоставляется в JavaScript. Вы также можете использовать RegEx, если хотите. - person Anirudh Ajith; 01.02.2015

arrow_upward
2
arrow_downward

более точной процедурой было бы использование регулярного выражения.

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

таким образом, вы знаете, что заменяете синий цвет для глаз, а не какой-либо синий цвет (например, любимый цвет). параметры «g» и «m» для регулярного выражения означают глобальные, что приведет к поиску всех применимых совпадений (если у вас есть более одного «глаза» в вашем json) и «m» для многострочного. если ваша строка многострочная.

person Gal Ziv    schedule 01.02.2015
comment
Я не могу заменить это так - person salvi shahzad; 24.03.2020

arrow_upward
0
arrow_downward

Первая итерация — 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
}))

Вторая итерация — будьте любезны для ES Harmony

  • добавить правило - добавляет строгое сравнение
  • add matcher — добавляет любую функцию, отвечающую за сопоставление/замену данных

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

person Krzysztof Safjanowski    schedule 27.06.2016

arrow_upward
0
arrow_downward

JSON манипуляции со строками можно легко выполнить с помощью JSON.parse() и JSON.stringify().

Образец примера приведен ниже:

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

Теперь tweetString имеет обновленный объект JSON.

person Dhanya Gopinath    schedule 09.05.2018