2015-02-01 1 views
8

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

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 код:

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

Это не работает

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

+0

эта часть вашего скрипта или самой страницы? –

+0

Что вы пробовали и почему вы предполагаете, что вам нужно использовать эти функции? – Paul

+0

@vishalsharma Эта часть находится на самой странице. – nemrod

ответ

7

Первый stringify() ваш JSON.

var stringified = JSON.stringify(json); 

Далее следует использовать функцию JavaScript String .replace().

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

parse() Ваш JSON в объект.

var jsonObject = JSON.parse(stringified); 

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

EDIT: Используйте эти линии вместо предыдущих .replace() s.

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

Могу ли я использовать регулярное выражение? Например: «(d +)»/g заменить «глаз»: «зеленый», потому что, если у меня есть «favorite_color»: «синий», мы можем видеть 2 раза одного цвета. – nemrod

+0

Вы могли бы, но я думаю, что функция '.replace()' String более прямолинейна прямо сейчас, поскольку она предоставляется на JavaScript в любом случае. Вы также можете использовать RegEx, если хотите. – Data2000

+0

Как мне создать свой последний код? – nemrod

0

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

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

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

0

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

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

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