实现json的三个操作(训练JSON)

1、实现JSON的对象的显示:

jsonObj

效果:

实现json的三个操作(训练JSON)_第1张图片

 

2、实现JSON字符串数组的下拉列表显示:

DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>实现JSONtitle>
    <script>

        function loadArray() {
           var cn = ["德国","英国","中国"];
           var cnselect = "";
           document.getElementById("jsonArray").innerHTML = cnselect;
        }

    script>
head>
<body onload="loadArray()">

<div id="jsonArray">div>

body>
html>

 

效果:

实现json的三个操作(训练JSON)_第2张图片

 

 3、实现JSON对象数组的表格显示:

jsonObjArray
DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JSON的实现title>
    <script>
        function loadObjArray() {
            var objs = [{"id":"1001","name":"admin","pwd":"000000"},{"id":"1002","name":"axe","pwd":"123456"},{"id":"1003","name":"gsl","pwd":"666666"}];
        var trs = "ID姓名密码";
        for (var i = 0;i<objs.length;i++){
            trs += ""+objs[i].id+""+objs[i].name+""+objs[i].pwd+"";
        }
        document.getElementById("jsonObjArray").innerHTML = trs;
        }

    script>
head>
<body onload="loadObjArray()">
<table id="jsonObjArray"border="1"width="300px">

table>

body>
html>

 

效果:

实现json的三个操作(训练JSON)_第3张图片

 

你可能感兴趣的:(实现json的三个操作(训练JSON))