标签:llb get home btn top 3.1 blog class 数据
【1】
HTML 插入第三方。
【2】
【3】
JavaScript 回调函数 & 模块化 --> 用变量封装数据、方法 --> 类比 Java 中的 package
var fetchLive = function(callback) { $.ajax({ url: "live/list.do", method: ‘GET‘, success: function (data) { callback(data); } }); }; var liveDisplay = { homepage: function(data) { console.log(data); var liveName = $(‘.telecast-title‘); var liveStatus = $(‘.live-status‘); var liveTime = $(‘.telecast-time‘); var liveHref = $(‘.live-href‘); const DISPLAY_NUM = (data.length < 4 ? data.length : 4); for (var i = 0; i != DISPLAY_NUM; ++i) { $(liveName[i]).text(data[i].name); $(liveStatus[i]).text(data[i].status); $(liveTime[i]).text(data[i].lastTime); liveHref[i].href = data[i].link; } } }; $(function () { fetchLive(liveDisplay.homepage); });
示例 02:
/** * 分类展示课程 */ const BASE_URL = "course/listbyid.do?categoryID="; var fetchCourseById = function(id, callback) { $.ajax({ url: BASE_URL + id, method: ‘GET‘, success: function (data) { callback(data); } }); }; var displayCourse = { frameA: function(courses) { // 首页页面展示1 var courseName = $(‘.recommended-course-name‘); var courseNum = $(‘.recommended-course-number‘); var coursePic = $(‘.recommended-course-picture‘); const DISPLAY_NUM = (courses.length < 6 ? courses.length : 6); for (var i = 0; i != DISPLAY_NUM; ++i) { $(courseName[i]).text(courses[i].title); $(courseNum[i]).text(courses[i].lessonNum); coursePic[i].src = courses[i].picture; } }, frameB: function(courses) { // 首页页面展示2 var courseName = $(‘.free-course-name‘); var courseNum = $(‘.free-course-lessionNum‘); var coursePic = $(‘.free-course-logo‘); var courseHref = $(‘.btn-study‘); const DISPLAY_NUM = (courses.length < 8 ? courses.length : 8); for (var i = 0; i != DISPLAY_NUM; ++i) { $(courseName[i]).text(courses[i].title); $(courseNum[i]).text(courses[i].lessonNum); coursePic[i].src = courses[i].picture; courseHref[i].href = ‘toPcLivePlay.do?source=‘ + courses[i].rtmp; } } } $(function () { fetchCourseById(2, displayCourse.frameA); fetchCourseById(1, displayCourse.frameB); });
标签:llb get home btn top 3.1 blog class 数据
原文地址:http://www.cnblogs.com/xkxf/p/7269898.html