js动态加载列表

这里用的是json做数据,其实在相应的工作中我们是后台给我们的数据,但是也是json数据。

<pre name="code" class="html"><script>
 var my_json='[{name:"范玮琪",sex:"悄悄告诉你"},{name:"范玮琪",sex:"悄悄告诉你"},{name:"范玮琪",sex:"悄悄告诉你"},{name:"范玮琪",sex:"悄悄告诉你"}]';
        var my_object=eval('('+my_json+')');
        function obj(eve){
            this.html = eve.name;
            this.html = eve.sex;
            this.get = function(){
                return "<div class='fir'>"+eve.name+"</div>" + "<div class='second'>"+eve.sex+"</div>";
        }
    }
        for(var i = 0;i<my_object.length;i++){
            var new_obj = new obj(my_object[i]);
            var div = document.createElement('div');
            div.id = 'list';
            document.body.appendChild(div);
            div.innerHTML += new_obj.get();
        }
</script>




<style type="text/css">
            body{
                background-color:white;
            }
            #list{
                height:100px;
                border-bottom:1px solid lightgray;
            }
            .fir{
                padding-top:15px;
                padding-left:50px;
                color:skyblue;
            }
            .second{
                padding-top:5px;
                padding-left:50px;
                color:lightgray;
                font-size:0.9em;
            }
        </style>

这样子我们的列表就做好了。

阅读更多
个人分类: javascript
想对作者说点什么? 我来说一句

JS前端列表排序

2012年06月08日 7KB 下载

首页/列表动态加载

2017年05月23日 2KB 下载

没有更多推荐了,返回首页

不良信息举报

js动态加载列表

最多只允许输入30个字

加入CSDN,享受更精准的内容推荐,与500万程序员共同成长!
关闭
关闭