jQuery读取数据
1、jQuery读取JSON
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jquery读取JSON</title>
</head>
<script type="text/javascript" src="jquery-3.2.1.js"></script>
<script>
$(function(){
$("#btn").click(function(){
$.getJSON("JSON/UserInfo.json",function(data){
var str="";
$.each(data,function( i,field){
$.each( field,function(k,v){
str+=k+":"+v+"<br/>"
})
str+="<br/>";
})
$("p").html(str);
})
})
})
</script>
<body>
<div>
<div id="btn">
<input type="button" value="读取JSON数据" id="btn"/>
</div>
<p></p>
</div>
</body>
</html>
2、jQuery加载XML文档
<!DOCTYPE html>
<html>
<head>
<title>使用jQuery加载XML文档</title>
<meta charset="utf-8">
<script type="text/javascript" src="jquery-3.2.1.js"></script>
<script type="text/javascript">
$(function(){
$("#getxml").click(function(){
$.ajax({
type:"get",
url:"5-3.xml",
dataType:"xml",
timeout:1000,
cache:false,//禁止缓存
success:function(data){
var frag=$("<ul/>");
$(data).find("student").each(function(){
var name=$(this).children("name");
var sex=$(this).children("sex");
var email=$(this).children("email");
name_value=name.text();
sex_value=sex.text();
email_value=email.text();
frag.append("<li>姓名:"+name_value+"性别:"+sex_value+"邮箱:"+email_value+"</li>");
});
frag.appendTo("#load");
$("li").css("list-style-type","none");
}
});
})
})
</script>
</head>
<body>
<input type="button" name="" id="getxml" value="加载xml">
<div id="load"></div>
</body>
</html>
jQuery读取数据的更多相关文章
- json数据的格式,JavaScript、jQuery读取json数据
JSON:JavaScript 对象表示法(JavaScript Object Notation). JSON的特点: JSON 是纯文本 JSON 具有“自我描述性”(人类可读) JSON 具有层级 ...
- Highcharts使用简例 + 异步动态读取数据
第一部分:在head之间加载两个JS库. <script src="html/js/jquery.js"></script> <script src= ...
- echarts通过ajax向服务器发送post请求,servlet从数据库读取数据并返回前端
1.echarts的官网上的demo,都是直接写死的随机数据,没有和数据库的交互,所以就自己写了一下,ok,我们开始一步一步走一遍整个流程吧. 就以官网最简单的那个小demo来做修改吧.官网上的小de ...
- jQuery.data的是jQuery的数据缓存系统
jQuery.Data源码 jQuery.data的是jQuery的数据缓存系统 jQuery.data的是jQuery的数据缓存系统.它的主要作用就是为普通对象或者DOM元素添加数据. 1 内部存储 ...
- Jquery实现数据双向绑定(赋值和取值),类似AngularJS
<!DOCTYPE html> <html> <head> <meta name="viewport" content="wid ...
- struts2中从后台读取数据到<s:select>
看到网上好多有struts2中从后台读取数据到<s:select>的,但都 不太详细,可能是我自己理解不了吧!所以我自己做了 一个,其中可能 有很多不好的地方,望广大网友指出 结果如图 p ...
- [MVC4]ASP.NET MVC4+EF5(Lambda/Linq)读取数据
继续上一节初始ASP.NET MVC4,继续深入学习,感受了一下微软的MVC4+EF5(EntityFramework5)框架的强大,能够高效的开发出网站应用开发系统,下面就看一下如何用MVC4+EF ...
- jQuery缓存数据
很多同学在项目中都喜欢将数据存储在HTMLElement属性上,如 1 2 3 4 <div data="some data">Test</div> < ...
- ubuntu server 12.04U盘安装,提示无法挂载安装光盘或光盘读取数据出错
今天用Ultraiso将Ubuntu server 12.04 刻入U盘中安装系统,中间提示错误:1.检测不到cdrom(即U盘没有挂载上):2.从光盘中读取数据出错.问题如下图所示: 上网搜了下解决 ...
随机推荐
- ABP vNext EventBus For RabbitMQ 分布式事件总线使用注意事项_补充官网文档
[https://docs.abp.io/zh-Hans/abp/latest/Distributed-Event-Bus-RabbitMQ-Integration](ABP vNext官方文档链接) ...
- netty启动流程
本文通过对netty服务端.客户端的启动流程分析, 让大家对netty是如何启动运行的. 废话不多说,上源码!!! 建议读者学习netty下的jar类型为 netty-example,里面有很多exa ...
- 【C++】《Effective C++》第三章
第三章 资源管理 条款13:以对象管理资源 当申请一块动态内存时,可能会发生内存泄漏. class Investment {}; void f() { Investment* pInv = creat ...
- 【LeetCode】365.水壶问题
题目描述 解题思路 思路一:裴蜀定理-数学法 由题意,每次操作只会让桶里的水总量增加x或y,或者减少x或y,即会给水的总量带来x或y的变化量,转为数字描述即为:找到一对整数a,b使得下式成立: ax+ ...
- 【Docker】Docker启动停止重启 Redirecting to /bin/systemctl start docker.service
[root@liuawen local]# docker -v Docker version 1.13.1, build cccb291/1.13.1 [root@liuawen local]# 启动 ...
- 【Linux】zabbix4.0服务器搭建,agent搭建,及邮件使用方法
zabbix默认的 服务端监听端口为10051,而被监控端即Zabbix--agents代理程序监控10050端口. 更新yum源: yum clean all yum makecache 需要配置网 ...
- 【MYSQL】MySQL5.6.37二进制安装
最近有个项目要用到mysql 于是在mysql的论坛中找到了一个5.6.37版本的 下面介绍怎么安装和使用mysql 下载地址: https://dev.mysql.com/downloads/mys ...
- Mybatis执行流程学习之手写mybatis雏形
Mybatis是目前开发中最常用的一款基于ORM思想的半自动持久层框架,平时我们都仅仅停留在使用阶段,对mybatis是怎样运行的并不清楚,今天抽空找到一些资料自学了一波,自己写了一个mybatis的 ...
- 24V转5V稳压芯片,高效率的同步降压DC-DC变换器3A输出电流
PW2330开发了一种高效率的同步降压DC-DC变换器3A输出电流.PW2330在4.5V到30V的宽输入电压范围内工作集成主开关和同步开关,具有非常低的RDS(ON)以最小化传导损失.PW2330采 ...
- Docker镜像仓库Harbor安装
export VERSION=18.06 && curl -fsSL http://rainbond-pkg.oss-cn-shanghai.aliyuncs.com/releases ...