skrypt użytkownika/dodatek do przeglądarki

Question

Witam,
Męczę się ze zrobieniem czegoś(dodatek do chrome lub skrypt użytkownika) do pobierania ceny skinów z cs:go i wyświetlania ich na stronce... Prosiłbym o jakieś wskazówki bo komletnie nie wiem jak ugryźć dwa tematy mianowicie:
1.Mam np taki link:

http://steamcommunity.com/market/priceoverview/?appid=730&currency=3&market_hash_name=StatTrak%E2%84%A2 M4A1-S | Hyper Beast (Minimal Wear)

On fajnie pokazuje minimalną cenę danego przedmiotu na rynku... Jak zrobić w JS aby dzięki temu linkowi dostać po prostu w zmiennej cenę tego przedmiotu?

2.Stronka którą chcę modyfikować składa się z wielu diwów ze zdjęciem,nazwą,ceną itp każdego skina... divy mają tylko klasę i każdy oczywiście taką samą bo są generowane w js... Jak po pierwsze pobrać z czegoś takiego kwote z mniejszego diva i nazwę skina z drugiego mniejszego diva mieszczącego się w tym samym divie? Najlepiej chyba by było zrobić jakiś przycisk w dużym divie aby po jego kliknięciu się pobierała cena z markeru i pokazywała obok tej na stronce... Jak to ugryźć?

Będę wdzięczny za każdą wskazówkę JS to nigdy nie był mój konik i póki co dość topornie mi z nim idzie... ;)

 

Answer 1

Cześć,

1. W odpowiedzi na taki url dostajesz JSON. W JS pobierasz go za pomocą XMLHttpRequest (link do tutoriala) lub Fetch API (link do tutoriala). Musisz poczytać, jak to działa i pamiętać, że są to funkcje asynchroniczne. W odpowiedzi dostajesz wspomniany JSON, który za pomocą metody JSON.parse możesz zmienić na obiekt JS-owy i z nim już zrobić, co ci się żywnie podoba.

2. Poczytaj o DOM i jak się po nim poruszać w JS. Bo możesz np. pobrać zawartość nadrzędnego diva, a potem zająć się elementami potomnymi w samym JS.

Swoją drogą chciałeś stworzyć dodatek do przeglądarki, swego czasu napisałam krótki tutorial o tym, jak napisać taki (link do wpisu) 

Answer 2

Odpytując ten adres dostajesz dane w formacie JSON. Aby operować na nich w JS wystarczy przepuścić je przez parser. W javascript jest to dość proste

// data to zmienna z tekstem, który dostajesz odpytując ten adres
var obj = JSON.parse(data);

MDN