getJSON jak wydobyć dane z tabeli?

pytanie zadane 17 maja 2017 w JavaScript przez jaco Początkujący (290 p.)

Cześć
Jestem kompletnie zielony z tego mój kod to

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("button").click(function(){
        $.getJSON("http://gw.api.alibaba.com/openapi/param2/2/portals.open/api.listPromotionProduct/MOJKLUCZ?fields=productUrl,imageUrl,productId&keywords=android", function(result){
            $.each(result, function(i, field){
                $("div").append(field + " ");
            });
        });
    });
});
</script>
</head>
<body>

<button>Get JSON data</button>

<div></div>

</body>
</html>

Zwraca on takie wyniki:

[object Object] 20010000

Tablica wygląda tak:

{
-result: {
totalResults: 136188,
-products: (20)[
-{
imageUrl: https://ae01.alicdn.com/kf/HTB1VWxtPVXXXXX6XFXXq6xXFXXXb/Original-Xiaomi-MI-BOX-font-b-Android-b-font-6-0-Smart-Set-top-TV-Box.jpg,
productUrl: https://www.aliexpress.com/item/Free-Shipping-XiaoMi-Mi-tv-box-3-Wifi-Amlogic-S905-64bit-Quad-Core-1GB-DDR3-Android/32699739438.html,
productId: 32699739438
},
-{
imageUrl: https://ae01.alicdn.com/kf/HTB1INh6PVXXXXbqaXXXq6xXFXXXk/Original-Xiaomi-MI-BOX-font-b-Android-b-font-6-0-Smart-Set-top-TV-Box.jpg,
productUrl: https://www.aliexpress.com/item/Global-Version-Xiaomi-Mi-box-3-WiFi-Bluetooth-64bit-2GB-DDR3-Android-6-0-Smart/32776343203.html,
productId: 32776343203
},
-{
imageUrl: https://ae01.alicdn.com/kf/HTB1KfTFPFXXXXb1XFXXq6xXFXXX0/Original-MINIX-NEO-U9-H-font-b-Android-b-font-6-0-1-TV-Box-Amlogic.jpg,
productUrl: https://www.aliexpress.com/item/MINIX-NEO-U9-H-Android-TV-Box-Amlogic-S912-H-Octa-Core-2G-16G-802-11ac/32794304903.html,
productId: 32794304903
},
-{
imageUrl: https://ae01.alicdn.com/kf/HTB15jlpNXXXXXbiaXXXq6xXFXXXk/-DHL-Free-10pcs-2GB-16GB-Optional-X96-font-b-Android-b-font-6-0-TV.jpg,
productUrl: https://www.aliexpress.com/item/10pcs-1GB-8GB-X96-Android-6-0-TV-BOX-Amlogic-S905X-Quad-Core-Marshmallow-WIFI-Wifi/32701406731.html,
productId: 32701406731
},
-{
imageUrl: https://ae01.alicdn.com/kf/HTB1qvBKQXXXXXXhXpXXq6xXFXXXk/Newest-Beelink-GT1-Ultimate-TV-Box-3G-RAM-32G-ROM-Amlogic-S912-Octa-Core-CPU-font.jpg,
productUrl: https://www.aliexpress.com/item/Newest-Beelink-GT1-Ultimate-TV-Box-3G-RAM-32G-ROM-Amlogic-S912-Octa-Core-CPU-Android/32798714421.html,
productId: 32798714421
},

Moje pytanie, jak pobierać kolejne URLe? Na początek jak wygenerować cokolwiek innego od tego co dostaje?

1 odpowiedź

odpowiedź 17 maja 2017 przez ScriptyChris Mędrzec (190,190 p.)
edycja 17 maja 2017 przez ScriptyChris

Użyj JSON.parse(), aby uzyskać obiekt, do którego pól i metod będziesz mieć wygodny dostęp za pomocą operatora kropki bądź operatora nawiasów kwadratowych.

Najpierw jednak popraw strukturę tego JSONa, ponieważ nie jest on poprawny składniowo. Składnię "na bieżąco" możesz sobie sprawdzać np. takim narzędziem: https://jsonlint.com/

Pokaż 7 poprzednich komentarzy

komentarz 17 maja 2017 przez ScriptyChris Mędrzec (190,190 p.)

W takim razie zapisz:

console.log('API result: ', result.result);

, żeby było widać w konsoli tego JSONa z tablicą products

komentarz 19 maja 2017 przez jaco Początkujący (290 p.)

Wielkie dzięki za pomoc!!

teraz jest tek

API result:  
Object {totalResults: 132652, products: Array(20)}
products
:
Array(20)
totalResults
:
132652
__proto__
:
Object

Jest to 20 produktówz czego każdy ma swoją nazwę zdjęcie i URL, jak ja teraz z tego mogę korzystać? tak żeby wyświetlać wszystkie albo najlepiej po kolei po kliknięciu w jakąś strzałkę??

komentarz 19 maja 2017 przez jaco Początkujący (290 p.)
edycja 19 maja 2017 przez jaco

$.getJSON("http://gw.api.alibaba.com/openapi/param2/2/portals.open/api.listPromotionProduct/62162?fields=productUrl,imageUrl,productId&keywords=android", function(result){
        document.write(result.result.products[0].imageUrl);
        document.write(result.result.products[1].imageUrl);

Uprościłem kod, jest to co chciałem!
Teraz pytanie gdzie szukać i pod jakimi hasłami tutoriali które mnie nauczą jak sobie pogrupować te dane przetworzyć je i wyświetlić?

komentarz 19 maja 2017 przez ScriptyChris Mędrzec (190,190 p.)

Zależy jak chcesz to pogrupować. Do pracy z obiektami i tablicami przydadzą Ci się: for..in, for..of, .map().

Nie znam tutoriali, które uczą grupowania struktur danych w JavaScript - wg mnie tego, razem z nabieranym doświadczeniem, nauczysz się samemu. Możesz poczytać sobie to i to.