Greasemonkey Script change value on Class (multiplication)

Question

I would like to load a website with prices converted to my currency, so I need to multiply the value within a span by a constant. For exemple:

109 €

I need the script to multiply the value within that span and print the result without the euro sign.

// ==UserScript==
// @name     PriceChanger
// @version  1
// @grant    none
// @include *://*.website.com/*
// ==/UserScript==
document.getElementsByClassName("prod-price").innerHTML = getElementsByClassName("prod-price") * 2;

Expected result: "218" instead of "109 €"

Zenoo · Answer 1 · 2019-08-19T13:19:00.437

2

First of all, you have to loop through every element before applying any modification. (Here I'm using querySelectorAll with forEach)

Then, you need to split your initial content to retrieve the price separately as a number:

document.querySelectorAll(".prod-price").forEach(price => {
  price.innerHTML = +price.textContent.split(' ')[0] * 2 + ' X';
});

<p class="prod-price">108 €</p>
<p class="prod-price">38 €</p>
<p class="prod-price">405 €</p>

edited Aug 19 '19 at 13:19

answered Aug 19 '19 at 13:13

Zenoo

12,670
4
45
69

Thanks! kind of works partially, I just don't get the numerical result of the mathematical operation, it just prints "0" and the X value specified in the script. Could it be due to the fact that the class contains a currency symbol together with the number? is there a way to ignore it on the script calculation? – Barkman Aug 19 '19 at 15:25
This solution partially works, but instead of printing a number is giving a NaN error as the var that it's trying to multiply contains a currency symbol. So, how can we improve this code to take only the numeric value from the input .prod-price? – Barkman Aug 19 '19 at 21:18

Slobodan Margetić · Accepted Answer · 2019-08-20T15:09:51.100

1

     var elem=document.getElementsByClassName("primary"); 
    //you can loop this second part 
    var temp = elem[0].innerHTML; 
    var tempsubstring=temp.substr(1,6); 
//i put a 6 for the end in case u get some longer prices and it works if it is shorter as well. u might also put like 15 if ure gona have some super long prices
    elem[0].innerHTML="Yourcurrency"+tempsubstring*2;

i have edited my response once again. now for this one i tested it and it works, so u can just copy paste the whole thing. Please acept the answer if its ok.

just add a loop where i commented.

var elem=document.getElementsByClassName("primary");
var i;
for (i=0;i<elem.length;i++){
var temp = elem[i].innerHTML;
var tempsubstring=temp.substr(1,6);
elem[i].innerHTML="Yourcurrency"+tempsubstring*2;
}

edited Aug 20 '19 at 15:09

answered Aug 19 '19 at 13:32

Slobodan Margetić

148
1
11

the result for this is NANEur – Barkman Aug 19 '19 at 15:28
it would help if you can add an example of the element that you are editing. zeno's example is using
108 €
but if his code with the textContent.split(' ') isnt working properly as well then the container might have some more data inside it. – Slobodan Margetić Aug 19 '19 at 16:38
Strange, I included it in the original post but it's not there. Here is the complete html code of the section that the Javascript must act on:

€279

– Barkman Aug 19 '19 at 17:00
I've tried few variations of the solutions proposed on this post but no luck: https://stackoverflow.com/questions/10398931/how-to-remove-text-from-a-string-in-javascript – Barkman Aug 19 '19 at 20:08
i suggest u try using "primary" instead of "prod-price" because contents of product price is another div that contains a span that only then contains the actual content u wish to change. also because the content is in format "Char" then "number" u need to split it like Zenoo suggested. except you need to change "textContent.split(' ')[0] * 2 " to "textContent.split(' ')[1] * 2" because the content split gives u an array of elements divided by a space and because the format is € 279 the second element is the number u want to change. also if the format is not "€ 279" but instead "€279" then – Slobodan Margetić Aug 19 '19 at 20:31
Thanks for the efforts but couldn't get to work at all in no variation of your code. I've tried again with Zenoo's code (with your advice of using 'primary') and works great, but the fact that it gets a NaN error. How can that code from Zenoo be improved to only take the numeric value? the function textContent.split(' ')[1] works but, by changing the number on brackets, the multiplication only affect to the number in that possition (1 stands for the second character of that var) – Barkman Aug 19 '19 at 21:27
check out the latest version of the answer, i tested it and it works. also when writing scripts like this your best friend is "right click" "inspect page" then select the console and you can see what is causing the problem. for the previos version the console said temp is undefind which meant there was something wrong with elem[0].innerHTML.textContent its supposed to be just elem[0].innerHTML – Slobodan Margetić Aug 20 '19 at 08:47
Thanks Slobodan Margetić, also works but only for the first element with the affected class, while the method from Zenoo applies it to all prices on the page with the same class "primary" – Barkman Aug 20 '19 at 13:54

Barkman · Answer 3 · 2019-08-20T14:00:16.543

0

Final solution that changes all prices on the page using the class "primary", omits the € symbol and ads USD instead:

// ==UserScript==
// @name     price
// @version  1
// @grant    none
// @include *://*.domain.com/*
// ==/UserScript==
document.querySelectorAll(".primary").forEach(price => {
  price.innerHTML = 'USD ' + price.textContent.split(' ')[0] * 2;
});

This solution is a temporary solution, it wont give correct outputs for operations involving decimals, it will print a NAN error instead

edited Aug 20 '19 at 14:00

answered Aug 19 '19 at 17:44

Barkman

25
8

This isn't an answer. It should be [edited](https://stackoverflow.com/posts/57557423/edit) into the question. – AuxTaco Aug 19 '19 at 20:59

Greasemonkey Script change value on Class (multiplication)

3 Answers3