ajax({
    method : 'get',
    url : 'http://study.163.com/webDev/couresByCategory.htm',
    data : {
        'pageNo':pageNo,
        'psize':psize,
        'type':type
    },
    success : function (data) {
        console.log(data);
        var _data = JSON.parse(data);
        var op = document.getElementById("courseList");
        var list = op.getElementsByTagName('li');
 
        for(i=0;i<_data.list.length;i++){
            var oLi = document.createElement("li");
            oLi.setAttribute('class','courseStyle');
            oLi.num=i;
            op.appendChild(oLi);
 //创建节点·······················································
            var _img = document.createElement("img");        
            var _name = document.createElement("p");
            var _provider = document.createElement("p");
            var _count = document.createElement("p");
            var _price = document.createElement("p");            
//赋给节点属性及内容···············································
            _img.setAttribute("src", _data.list[i].middlePhotoUrl);    
            _img.setAttribute("class", "img");
            _name.innerHTML=_data.list[i].name;
            _provider.innerHTML=_data.list[i].provider;
            _count.innerHTML=_data.list[i].learnerCount;
            _price.innerHTML="&yen;"+_data.list[i].price;
//添加到li列表中···················································
            oLi.appendChild(_img);
            oLi.appendChild(_name);
            oLi.appendChild(_provider);
            oLi.appendChild(_count);
            oLi.appendChild(_price);
//设置属性样式······················································         
            _name.setAttribute('class','courseName');
            _provider.setAttribute('class','courseProvider');
            _count.setAttribute('class','peopleCount');
            _price.setAttribute('class','coursePrice');
        }
        var n = 0;
        var before;

        for (var i = 0; i < 5; i++) {                //试用固定定位布局课程列表卡片        
            for (var j = 0; j < 4; j++) {
                list[n].style.left=j*245+"px";
                list[n].style.top=i*249+"px";
                n++;
            };
        }

        for (var i = 0,len = list.length; i < len; i++) {

            addEvent(list[i],'mouseenter',mouseOver);        //鼠标移入弹出课程内容卡片
            addEvent(list[i],'mouseleave',function(){            //移出恢复相应状态
                this.innerHTML="";

            var _img = document.createElement("img");
            var _name = document.createElement("p");
            var _provider = document.createElement("p");
            var _count = document.createElement("p");
            var _price = document.createElement("p");

            _img.setAttribute("src", _data.list[this.num].middlePhotoUrl);//ie8下 不能识别此属性方法
            _img.setAttribute("class", "img");
            _name.innerHTML=_data.list[this.num].name;//ie8下 不能识别此属性方法
            _provider.innerHTML=_data.list[this.num].provider;//ie8下 不能识别此属性方法··········
            _count.innerHTML=_data.list[this.num].learnerCount;
            _price.innerHTML="¥"+_data.list[this.num].price;
 
            this.appendChild(_img);
            this.appendChild(_name);
            this.appendChild(_provider);
            this.appendChild(_count);
            this.appendChild(_price);
           
            _name.setAttribute('class','courseName');
            _provider.setAttribute('class','courseProvider');
            _count.setAttribute('class','peopleCount');
            _price.setAttribute('class','coursePrice');
                
                })}
        function mouseOver(){                            //创建弹出内容卡片函数
                before = this.getElementsByTagName('p');
                for (var i = 0; i < 4; i++) {            //隐藏鼠标不移入时显示的内容
                    before[i].style.display="none";                        
                };
                var _name = document.createElement("p");
                _name.innerHTML=_data.list[this.num].name;
                _name.setAttribute('id','appendH');
                this.appendChild(_name);

                var _count = document.createElement("p");
                _count.innerHTML=_data.list[this.num].learnerCount + "人在学";
                _count.setAttribute('id','appendC');
                this.appendChild(_count);

                var _provider = document.createElement("p");
                _provider.innerHTML="发布者："+_data.list[this.num].provider;
                _provider.setAttribute('id','appendA');
                this.appendChild(_provider);

                var _class = document.createElement("p");
                _class.innerHTML="分类："+_data.list[this.num].categoryName;
                _class.setAttribute('id','appendCl');
                this.appendChild(_class);

                var _descript = document.createElement("p");
                _descript.innerHTML=_data.list[this.num].description;
                _descript.setAttribute('id','appendP');
                this.appendChild(_descript);

            }

    },
    async : true
});
}