JSON文件 上传到gethub上使用
以下是我写好的JSON文件：
{"Name" : "枪械介绍",
"Introduction" : "堡垒之夜已经上线了超过二十种的各式枪械，并且还在不断更新中！选择最适合你的武器，找到最适合你的战斗方式。",
"members" : [
{
"name" : "开局生存",
"Description" :"开局没有理想武器的情况下，可以使用手枪防身。",
"fiearmsType": [
"普通手枪：中规中矩的手枪，中远距离衰减明显",
"消音手枪：各方面数据均领先于普通手枪，同时多了消音特性，不易察觉，子弹弹道不可见。",
"左轮手枪：射速低，威力大，对射击要求较高。",
"加农手枪：左轮手枪的进阶版，射速低，威力大，适合枪法好的玩家。"
]
},
{ "name" : "近距离作战",
"Description" :"近距离面对敌人，可以使用霰弹枪或者冲锋枪。",
"fiearmsType":[
"泵动式霰弹枪:威力巨大，对于射击节奏的掌控有一定要求。",
"战术霰弹枪:射击速度，更加稳定，更适合新手。",
"重型霰弹枪:爆头伤害较高，射速、弹夹和基础伤害较均衡，较难获得。",
"消音冲锋枪:声音不易察觉，子弹弹道不可见，射速高，近战输出稳定。",
"战术冲锋枪:尽管单发伤害不如消音冲锋枪，但更高的射速提升了它的输出能力。"
]
},
{ "name" : "中远程作战",
"Description" :"突击步枪适合中远距离作战，常作为主武器配备，瞄准速度快，可以精确打击敌人和摧毁建筑。",
"fiearmsType":[
"M4突击步枪:各方面属性均衡，上手难度低，前期较容易获得。",
"Scar突击步枪:M4步枪的进阶版，各方面数据均领先于M4,获取难度大。",
"连发突击步枪:三连发半自动步枪，可造成较大爆发伤害，射击节奏较难掌控。",
"Famas突击步枪:连发步枪的进阶版，各方面数据均领先于连发突击步枪,获取难度大。",
"带镜突击步枪:有倍镜的步枪，射速和弹夹低于其他步枪，伤害略低，但中远距离射击精度非常高。",
"热成像突击步枪:带有倍镜并且可以在瞄准时突出显示敌人（甚至宝箱和空投），伤害和精度高，但弹夹和射速低且难获得。"
]
},
{"name" : "远程狙击",
"Description" :"狙击步枪作为超远距离击杀最终极的利器，放大视野的特性使它瞄准起来更为容易，也容易赋予敌人心理上的压力，谁都害怕毫无征兆的突然升天。",
"fiearmsType":[
"栓动式狙击步枪:一发一换弹的狙杀神器，伤害爆炸，百米之外可取敌将首级。",
"半自动狙击步枪:连发狙击，弹夹容量为10发，虽然伤害不如栓动式但战斗兼容性更高。",
"猎枪:与其他两款狙击步枪相比，最大的不同在于它不配备瞄准镜。伤害低于栓动狙击步枪，高于半自动狙击步枪。"
]
},
{"name" : "爆破拆楼",
"Description" :"高爆武器所到之处寸草不生，他们带来的巨大的爆炸能量会瞬间炸毁一切，再坚不可催的房屋和建筑，也会被炸的灰飞烟灭。",
"fiearmsType":[
"轻机枪:使用中型子弹的压制性重武器，高射速，高弹容量，单发伤害和精准较低，擅长火力压制以及摧毁建筑。",
"迷你加特林:超高射速，无需换弹，适合战场中火力压制。但缺陷在于射击前需要预热，射击时人物移动慢。",
"榴弹发射器:抛物线弹道的榴弹炮，六发容量，固定时间后爆炸。",
"火箭筒:一次一发，线型弹道无下坠，速度极慢，遇到物体后爆炸。"
]
}
]
}
将以上代码的文件上传到gethub上进行托管，在使用JS调用
以下是仿照模板写的JS：
var header = document.querySelector('header');
var section = document.querySelector('section');
var requestURL = 'https://raw.githubusercontent.com/lizhidage/web/master/firearms.json';
var request = new XMLHttpRequest();
request.open('GET', requestURL,true);
request.responseType = 'json';
request.send();
request.onload = function() {
var Firearms = request.response;
populateHeader(Firearms);
show(Firearms);
}
function populateHeader(jsonObj) {
var myH1 = document.createElement('h1');
myH1.textContent = jsonObj['Name'];
header.appendChild(myH1);
var myPara = document.createElement('p');
myPara.textContent = jsonObj['Introduction'] ;
header.appendChild(myPara);
}
function show(jsonObj) {
var firearms = jsonObj['members'];
for(i = 0; i <firearms.length; i++) {
var myArticle = document.createElement('article');
var myH2 = document.createElement('h2');
var myPara1 = document.createElement('p');
var myPara2 = document.createElement('p');
var myList = document.createElement('ul');
myH2.textContent = firearms[i].name;
myPara1.textContent = firearms[i].Description;
myPara2.textContent = "枪支简介:";
var fiearmsType = firearms[i].fiearmsType;
for(j = 0; j < fiearmsType.length; j++) {
var listItem = document.createElement('li');
listItem.textContent = fiearmsType[j];
myList.appendChild(listItem);
}
myArticle.appendChild(myH2);
myArticle.appendChild(myPara1);
myArticle.appendChild(myPara2);
myArticle.appendChild(myList);
section.appendChild(myArticle);
}
}
