分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > IT知识

jquery实现JSON数据获取

发布时间:2023-09-06 01:08责任编辑:傅花花关键词:暂无标签

html代码:

<!DOCTYPE html><html lang="en"><head> ???<meta charset="UTF-8"> ???<title>获取JSON</title> ???<script type="text/javascript" src="jquery-3.2.1.js"></script></head><body> ???<div class="myDiv" style="color:aliceblue"></div> ???<button class="btn">获取数据</button> ???<script type="text/javascript"> ???$(function(){ ???????$(".btn").click(function(){ ???????????$(".myDiv").empty();//每次点击按钮清空原来数据,防止无限加载。 ???????????$.ajax({ ???????????????url:"data.txt", ???????????????datatype:"json", ???????????????type:"GET", ????????????????success:function(data){ ????????????????????$.each($.parseJSON(data),function(n,item){ ?//.parseJSON()方法把JSON字符串转换为javascript对象,不转换的话将会抛出错误。 ???????????????????????$(".myDiv").append("<p>key:"+item.optionKey+"</br>value:"+item.optionValue+"</p>");//控制输出的数据格式 ???????????????????}) ???????????????} ???????????}) ???????}) ???}) ???</script></body></html>

json部分:

[ {"optionKey":"1", "optionValue":"Canon in D"}, {"optionKey":"2", "optionValue":"Wind Song"}, {"optionKey":"3", "optionValue":"Wings"} ] 

jquery实现JSON数据获取

原文地址:http://www.cnblogs.com/yzhweb/p/7471997.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved