SOURCE

console 命令行工具 X clear

                    
>
console
(function () {
    var rangeList = [],
        rangeObj = document.querySelector('.range > span'),
        resultObj = document.querySelector('.result > span'),
        addBtn = document.getElementById('addBtn'),
        confirmBtn = document.getElementById('confirmBtn'),
        newText = document.getElementById('restaurant');
    
    /**
     * 添加新的餐馆名称
     * @param {String} newName   输入的餐馆名称
     */
    function addRestaurant(newName) {
        rangeList.push(newName);
        var a = document.createElement('a');
        a.innerHTML = ' ' + newName + ' ×|';
        a.setAttribute('href', 'javascript:void(0);');
        a.setAttribute('data-name', newName);
        a.onclick = delRestaurant;
        rangeObj.appendChild(a);
    }
    
    function delRestaurant() {
        var resName = this.getAttribute('data-name'),
            index = rangeList.indexOf(resName);
        rangeList.splice(index, 1);
        this.parentNode.removeChild(this);
    }
    
    function decide() {
        var len = rangeList.length;
        resultObj.innerHTML = rangeList[Math.floor(Math.random() * len)];
    }
    
    addBtn.onclick = function () {
        var newName = newText.value;
        if (!newName || rangeList.indexOf(newName) !== -1) return;
        addRestaurant(newName);
        newText.value = "";
    };
  
    confirmBtn.onclick = function () {
        decide();
    };
})();
<input type="text" id="restaurant">
  <button id="addBtn">加入</button>
  <button id="confirmBtn">随机抽选</button>
  <hr>
  <div class="range">
      选择范围:<span></span>
  </div>
  <hr>
  <div class="result">
      结果:<span></span>
  </div>
  <div id="test"></div>
a {
  color: #000;
  text-decoration: none;
}