HTML实战(6):静态网页的“数据库”

1.JSON介绍

        JSON（JavaScript Object Notation, JS对象简谱）是一种轻量级的数据交换格式。可以用window自带记事本打开编辑，易于人阅读和编写，同时也易于机器解析和生成。

        静态网页一般只用于数据展示，用服务器数据库来做门槛较高，用JSON来做静态网页的数据存储就很合适，以下介绍html如何与JSON进行数据交互

2.JSON源码

train([
{
"产品类型":"电磁阀",
"序号":"1",
"频次":"76",
"品牌":"ASCO",
"型号":"JPIS8551B301",
"适用温度":"-25~60",
"材质":"铝合金",
"Cv值":"0.86",
"作用方式":"两位五通",
"接口":"1/4NPT(F)",
"电源接口":"1/2NPT(F)",
"电源电压":"24V",
"防爆等级":"ExiaIICT6",
"防护等级":"IP66",
"安装方式":"贴片式",
"后缀":"自动复位",
"功耗":"1.5",
"耐压":"2-10.4bar",
"单双电控":"单电控",
"驱动方式":"先导",
"线圈等级":"H",
"接线盒":"带，铝合金",
"单价":"****",
"备注":"",
"样本":"551B301_302",
"图片":"551B301_302.png",
"证书1":"",
"证书2":"",
"证书3":""},
])

3.html中调用JSON

<script type="text/javascript">
	var data1;
	function train (data){
		 //console.log(data);
		 data1=data;
		 console.log(data1.length);
		 console.log(data1[0]["材质"]);
	}
</script>

JSON中定义函数train，html中调用train即可使用data数据