1
<div id="main"></div>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
function aa() {
    var oMain = document.getElementById('main');
    var ITEM_WIDTH = 200;
    var ITEM_SPACE = 10;
    var itemArray = [];
    var itemHeight = [];
    // 求随机数
    function rand(min, max) {
        return parseInt(Math.random() * (max - min + 1) + min);
    }
    function createItem(min, max) {
        for (var i = min; i < max; i++) {
            var div = document.createElement('div');
            div.innerHTML = i;
            div.style.height = rand(100, 300) + 'px';
            div.style.width = ITEM_WIDTH + 'px';
            div.style.backgroundColor = 'rgb(' + rand(0, 255) + ',' + rand(0, 255) + ',' + rand(0, 255) + ')';
            oMain.appendChild(div);
            itemArray[i] = div;
        }
        layout();
    }
    createItem(0, 30);
    //div的布局
    function layout() {
        var t = 0;
        var l = 0;
        var frist = true;
        var mainWidth = 0;
        var winWidth = document.documentElement.clientWidth || document.body.clientWidth;
        for (var i = 0; i < itemArray.length; i++) {
            if ((l + ITEM_WIDTH) >= winWidth) {
                frist = false;
                mainWidth = l;
                l = 0;
            }
            if (frist) {
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX