怎么使用jquery中ajax来获取数据,

好久没有写鸡汤了,真的是三天不要学习,就不学习了,1玩小时定律你懂的,直接说怎么写是做好的,直说最简单的方式,】

【1】 我一般习惯帮项目放在php环境的www目录下运行.如果知道php的都知道怎么回事,还是来说怎么安装这个吧 ,

直接搜索WampServer这个就会看到百度软件中心,直接点击普通下载,下一部下一部的安装即可。打开,电脑又下角如果出现一个绿色的小标志表示成功。我们可以点击它帮语言切换成中文,点击一个localhost的我们就是打开一个窗口,默认是8080.如果你的端口被占用可以修改配置文件,但是新手来说还是直接把其他打开的一些软件先暂停了,这个就是运行正常。

这里要记得刚才你是安装在哪个目录下的,找到www目录,我们直接来写代码。
以上说的都是废话,正式的开始
在www目录下创建文件夹demo,再在demo下面建立index.html和index.json文件
josn文件是用来模拟数据的。

index.html代码如下

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<script src='https://cdn.bootcss.com/jquery/3.2.1/jquery.js'></script>
	<style>
		.main{
			width: 600px;
			height: 500px;
			background:  #c8c8c8;
		}
	</style>
</head>
<body>
	  <input type="button" value="点击" />
	  <div class="main">
	        	<ul>
	  	
	  	        </ul>
	  </div>
</body>
<script type="text/javascript">
	$(function(){
		           $.ajax({
		            url: "index.json",
		            type: "post",
		            dataType: "json",
		            contentType: "application/json;charset=UTF-8",
		            beforeSend: function (xhr) {
		                		        
		            },
		            success: function (response) {                                   
                           var obj = response;
		                    var html ="";
		                       $.each(obj,function(index, el) {
		                       	html +='<li>'+el.title+'</li>'
		                       });
                            $(".main").append(html);        
		            }
		        })
	});
</script>>
</html>

index.json文件

[
		{"title":"我们不一样"},
		{"title":"我如果你砍到这里,你想知道楼主长什么样,告诉你,30多岁了,        http://www.iqiyi.com/w_19ruwgagkh.html这个是楼主的视频链接"},
		{"title":"我的阿斯达岁的"}

]

josn需要满足键值的格式,

我们打开index.html文件,页面上就会有3条li.
就是这么简单
如果你刚才是在www下的demo 文件夹下的直接http://localhost/demo/index.html这样打开,如果你的文件没在服务器下,那你直接正常打开。

上面的都不要解释了吧 append这个就是帮内容添加到想添加带的容器中,each就是遍历这个对象。

展开阅读全文
©️2020 CSDN 皮肤主题: 黑客帝国 设计师: 上身试试 返回首页
实付0元
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值