https://www.w3school.com.cn/jquery/jquery_ref_dom_element_methods.asp
jQuery 参考手册 - DOM 元素方法
【jQuery】使用getJSON()方法异步加载JSON格式数据
使用getJSON()方法可以通过Ajax异步请求的方式，获取服务器中的数组，并对获取的数据进行解析，显示在页面中，它的调用格式为：
jQuery.getJSON(url,[data],[callback])或$.getJSON(url,[data],[callback])
其中，url参数为请求加载json格式文件的服务器地址，可选项data参数为请求时发送的数据，callback参数为数据请求成功后，执行的回调函数。
例如，点击页面中的“加载”按钮，调用getJSON()方法获取服务器中JSON格式文件中的数据，并遍历数据，将指定的字段名内容显示在页面中。如下图所示：
在浏览器中显示的效果：
从图中可以看出，当点击“加载”按钮时，通过getJSON()方法调用服务器中的sport.json文件，获取返回的data文件数据，并遍历该数据对象，以data[“name”]取出数据中指定的内容，显示在页面中。
有几个地方不好理解：
function(data)是getJSON()方法的回调函数，也就是说执行了getJSON()方法后它就会执行，这里的data就是由getJSON方法从服务器地址取的数据，不需要定义。至于sport的话，你可以参考一下jQuery中each()函数的用法：
1
2
$(selector).each(function(index,element))
在这个例子中就相当于$.each(data,function(index,sport))
index就是取到的数据在数组中的位置，element就是具体的数据对象，sport作为function的参数，实际传入的是data数组中第index个对象，即data[index]，是一个json对象，所以sport["name"]就是这个json对象中的name对应的值。
————————————————
版权声明：本文为CSDN博主「badlyForPapers」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/happyhaojie/article/details/50348359
实例讲述了jQuery使用getJSON方法获取json数据。分享给大家供大家参考，具体如下：
demo.js：
[
{
"name"
:
"吴者然"
,
"sex"
:
"男"
,
"email"
:
"demo1@123.com"
},
{
"name"
:
"吴中者"
,
"sex"
:
"男"
,
"email"
:
"demo2@123.com"
},
{
"name"
:
"何开"
,
"sex"
:
"女"
,
"email"
:
"demo3@123.com"
}
]
<html>
<head>
<meta http-equiv=
"Content-Type"
content=
"text/html; charset=utf-8"
/>
<title>getJSON获取数据 jQuery使用getJSON方法获取json数据 </title>
<script type=
"text/javascript"
src=
"js/jquery-1.10.1.min.js"
></script>
<style type=
"text/css"
>
#divframe {
border: 1px solid
#999;
width: 500px;
margin: 0 auto;
}
.loadTitle {
background:
#CCC;
height: 30px;
}
</style>
<script type=
"text/javascript"
>
$(
function
(){
$(
"#btn"
).click(
function
(){
$.getJSON(
"js/demo.js"
,
function
(data){
var
$jsontip = $(
"#jsonTip"
);
var
strHtml =
"123"
;
//存储数据的变量
$jsontip.empty();
//清空内容
$.each(data,
function
(infoIndex,info){
strHtml +=
"姓名："
+info[
"name"
]+
"<br>"
;
strHtml +=
"性别："
+info[
"sex"
]+
"<br>"
;
strHtml +=
"邮箱："
+info[
"email"
]+
"<br>"
;
strHtml +=
"<hr>"
})
$jsontip.html(strHtml);
//显示处理后的数据
})
})
})
</script>
</head>
<body>
<div id=
"divframe"
>
<div class=
"loadTitle"
>
<input type=
"button"
value=
"获取数据"
id=
"btn"
/>
</div>
<div id=
"jsonTip"
> </div>
</div>
</body>
</html>
// jQuery url get parameters function [获取URL的GET参数值]
jQuery获取URL的GET参数值
// <code>
// var GET = $.urlGet(); //获取URL的Get参数
// var id = GET['id']; //取得id的值
// </code>
// url get parameters
// public
// return array()
(function($) {
$.extend({
urlGet:function()
{
var aQuery = window.location.href.split("?"); //取得Get参数
var aGET = new Array();
if(aQuery.length > 1)
{
var aBuf = aQuery[1].split("&");
for(var i=0, iLoop = aBuf.length; i<iLoop; i++)
{
var aTmp = aBuf[i].split("="); //分离key与Value
aGET[aTmp[0]] = aTmp[1];
}
}
return aGET;
}
})
})(jQuery);
//HTML代码
<a href="javascript:void(0)" class="cityname" id="{$rr[code]}" name='{$rr[name]}'>{$rr[name]}</a>
//jQuery代码
<script type="text/javascript">
//地区ajax获取数据
$(function(){
$(".cityname").click(function(){
var code = $(this).attr("id");
var name = $(this).attr("name");
$('#city_name').html(name);
var course_info ='';
var url="?m=content&c=cityPoster&a=wenduNewsInfos";
$.ajax({
type: "GET",
url: url,
data: {cityId:code},
dataType: "json",
async:false,
success: function(data){
course_info=data.data.posterArrs;//公告返回结果
course_arr=data.data.courseArrs;//课程返回结果
console.log(course_info);
return false;
html = '';
},
});
//课程ajax请求结果赋值
//考研公共课
var data_ggk=course_arr[0];
var kyhtml='';
kyhtml+=' <div class="local_courseLeft">';
if(data_ggk==''){
kyhtml+='<div class="second_interview">';
kyhtml+='<p class="other-choose">您可选择附近城市的分校课程<br>';
kyhtml+=' 也可以选择网校，在线学习<a class="enter_official" target="_blank" href="http://www.wenduedu.com/">进入文都网校</a></p>';
kyhtml+=' <p class="official_telphone">400-606-9976</p>';
kyhtml+='</div>';
}else if(data_ggk.length){
var length0=data_ggk.length;
for(var i=0;i< length0;i++){
kyhtml+='<div class="local_courseList">';
kyhtml+='<p class="localCourse_heading"><a href="'+data_ggk[i].url+'" title="'+data_ggk[i].title+'" target="_blank">'+data_ggk[i].title+'</a></p>';
kyhtml+='<div class="localCourse-introduce">';
kyhtml+='<span class="courseIntroduce-title">课程简介：</span>';
kyhtml+='<a class="localCourse-others localCourse-details" title="'+data_ggk[i].description+'" >'+data_ggk[i].description+'</a>';
kyhtml+='</div>';
kyhtml+='<div class="localCourse-introduce teach-master">';
kyhtml+='<span class="courseIntroduce-title">授课名师：</span>';
kyhtml+='<a class="localCourse-others teacher_Name" title="'+data_ggk[i].teacher+'">'+data_ggk[i].teacher+'</a>';
kyhtml+='</div>';
kyhtml+='<div class="localCourse_Enter">';
kyhtml+='<p class="remian-days">报名剩余'+data_ggk[i].sign_end+'天</p>';
kyhtml+='<a href="'+data_ggk[i].url+'" target="_blank" class="course-consult">报名咨询</a>';
kyhtml+='</div>';
kyhtml+='</div>';
}
}
kyhtml+='</div>';
//公告
kyhtml+='<div class="localCourse-notice">';
kyhtml+='<h3 class="common-titleModule common-titleModuleWD">';
kyhtml+='<a target="_blank" class="commonTitle_name" href="javascript:void(0)">公告</a><b class="commonTitle-line"></b></h3>';
kyhtml+='<ul class="localCourse-noticeList">';
for(var coursePer in course_info[0]){
kyhtml+='<li><a target="_blank" href="'+course_info[0][coursePer].url+'">'+course_info[0][coursePer].title+'</a></li>';
}
kyhtml += '</ul>';
kyhtml+='</div>';
$('#ggk').html('');
$('#ggk').html(kyhtml);
});
})
</script>
//控制器
$courseArrs = json_decode(trim($courseArrs,chr(239).chr(187).chr(191)),true);
$newData['courseArrs'] = $courseArrs['data'];
echo json_encode(array('state' => 1,'data'=>$newData));die;
————————————————
版权声明：本文为CSDN博主「jiangnanqbey」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/jiangnanqbey/article/details/78924586