• My json(Demo)


     1 {
     2     "mainactors": [{
     3             "image":"E:/vs code/my html/MyFirstWeb_姜辛_201710422107/picture.838ba61ea8d3fd1f509b00433b4e251f95ca5f3c.jpg",
     4             "character": "布鲁斯·韦恩",
     5             "actor": "演员:克里斯蒂安·贝尔",
     6             "story": "大部分时间,韦恩老爷都是哥潭市的花花公子和家族企业CEO,但当这座城市面临危机的时候,当欺诈、暴力、犯罪企图玷污这座城市的时候,他就是正义之神蝙蝠侠。幼小时他目睹了自己的父母死在罪犯手下,从此抛弃了优渥的生活,走南闯北,接受“影武者”联盟的特训,并为自己配备了高科技武器,在夜晚独自维护哥潭市的安宁。"
     7         },
     8 
     9         {
    10             "image":"E:/vs code/my html/MyFirstWeb_姜辛_201710422107/picture.a8ec8a13632762d07e6409c6abec08fa513dc675.jpg",
    11             "character": "小丑",
    12             "actor": "演员:希斯·莱杰",
    13             "story": "在戈登局长的大力配合下,蝙蝠侠不再是孤独的英雄,哥潭市正在从黑暗的边缘回到风气清明的安全城市。此时出现了一名叫做“小丑”的狂人。他不在乎金钱,也不求名利,他制造爆炸和屠杀,小丑所要做的就是对人性重新做考量,他要迫使从不杀人的蝙蝠侠手上染血。"
    14         },
    15 
    16         {
    17             "image":"E:/vs code/my html/MyFirstWeb_姜辛_201710422107/picture.4034970a304e251f810c4981ac86c9177e3e53cb.jpg",
    18             "character": "哈维·丹特",
    19             "actor": "演员:艾伦·艾克哈特",
    20             "story": "光明而又善良的检察官哈维·丹特唯一的问题就是太过偏执,自从他毁容的那一刻起,自从那枚硬币的一面布满刮痕的那一刻起,他的冲动与决心最终酿成了大错。"
    21         }
    22     ]
    23 }

    相应js代码如下:

     1 var requestURL = 'https://detachmentdd.github.io/eastwood/movie.json';
     2 var request = new XMLHttpRequest();
     3 request.open('GET', requestURL);
     4 request.responseType = 'json';
     5 request.send();
     6 request.onload = function () {
     7     var inf = request.response;
     8     var img = {}
     9     img[0] = document.getElementsByClassName('p1')[0].getElementsByTagName('img')[0];
    10     img[1] = document.getElementsByClassName('p2')[0].getElementsByTagName('img')[0];
    11     img[2] = document.getElementsByClassName('p3')[0].getElementsByTagName('img')[0];
    12     for (var i = 0; i < 3; i++) {
    13         img[i].setAttribute('src', inf.mainactors[i].image);
    14     }
    15 
    16 
    17     var ch = {}
    18     ch[0] = document.getElementById('ch0');
    19     ch[1] = document.getElementById('ch1');
    20     ch[2] = document.getElementById('ch2');
    21 
    22     for (var i = 0; i < 3; i++) {
    23         ch[i].innerHTML = ch[i].innerHTML.replace('', inf.mainactors[i].character);
    24     }
    25 
    26     var actor = {}
    27     actor[0] = document.getElementsByClassName('a1')[0].getElementsByTagName('span')[0];
    28     actor[1] = document.getElementsByClassName('a2')[0].getElementsByTagName('span')[0];
    29     actor[2] = document.getElementsByClassName('a3')[0].getElementsByTagName('span')[0];
    30     for (var i = 0; i < 3; i++) {
    31         actor[i].innerHTML = actor[i].innerHTML.replace('', inf.mainactors[i].actor);
    32     }
    33 }
  • 相关阅读:
    Open source cryptocurrency exchange
    Salted Password Hashing
    95. Unique Binary Search Trees II
    714. Best Time to Buy and Sell Stock with Transaction Fee
    680. Valid Palindrome II
    Java compiler level does not match the version of the installed Java project facet.
    eclipse自动编译
    Exception in thread "main" java.lang.StackOverflowError(栈溢出)
    博客背景美化——动态雪花飘落
    java九九乘法表
  • 原文地址:https://www.cnblogs.com/jx937542655/p/10190703.html
Copyright © 2020-2023  润新知