自动生成一组新闻

html:

<input type="button" value="自动生成5条新闻" id="btn">
<ul id="list"></ul>

js:

window.onload = function(){
    var arr = [
        '我是第一条新闻',
        '我是第二条新闻',
        '我是第三条新闻',
        '我是第五条新闻'
    ];
    var btn = document.getElementById('btn');
    var list = document.getElementById('list');

    btn.onclick = function(){
        for(var i=0;i<arr.length;i++){
            list.innerHTML += '<li>'+arr[i]+'</li>';//添加就是+=，如果是一个的话就直接是=
        }
    }
}

注意：
1、list.innerHTML +=加等是追加（累加），如果只有一个就直接写加号
2、点击一次追加一组新闻，继续点击会继续追加一组新闻；
我们希望点击一下按钮后就不能继续点击，怎么解决这个问题呢？

方法一：让按钮点击一次之后就不能再次点击，禁用按钮（不推荐）

btn.onclick = function(){
    btn.disabled = 'true';//点击一次按钮之后禁用该按钮

    for(var i=0;i<arr.length;i++){
        list.innerHTML += '<li>'+arr[i]+'</li>';
    }
}

方法二：点击之后让按钮隐藏（不推荐）

btn.onclick = function(){
    btn.style.display = 'none';//点击之后让按钮隐藏
    for(var i=0;i<arr.length;i++){
        list.innerHTML += '<li>'+arr[i]+'</li>';
    }
}

方法三：先清空，再显示一组新闻（性能差，不推荐）

btn.onclick = function(){
    list.innerHTML = ''             ;
    for(var i=0;i<arr.length;i++){
        list.innerHTML += '<li>'+arr[i]+'</li>';
    }
}

方法四：进行判断（代码多，但性能好；推荐）

var onOff = true;//设置一个开关，让其为真

btn.onclick = function(){
    if(onOff){//如果为真，那么就执行;如果为假就不执行
        for(var i=0;i<arr.length;i++){
            list.innerHTML += '<li>'+arr[i]+'</li>';
        }
    }
    onOff = false;//点击完之后，开关关闭(为假)              
}