数组filter（）方法的使用

输入价格后失去焦点就展示符合条件的商品，没有符合条件的商品就弹框提示

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div>
        <span> 请输入手机价格（输入能接受的最高价值）：</span>
        <input type="text" autofocus>
        <ul>

        </ul>

    </div>

    <script>
        const arr = [
            {
                name: '小米',
                price: 2999,
            },
            {
                name: '红米',
                price: 2000,
            },
            {
                name: '魅族',
                price: 2599,
            },
            {
                name: '华为',
                price: 7999,
            },
            {
                name: '荣耀',
                price: 2899,
            },
            {
                name: '联想',
                price: 999,
            },
            {
                name: '三星',
                price: 9999,
            },
            {
                name: '苹果',
                price: 7999,
            },
            {
                name: '诺基亚',
                price: 299,
            },
            {
                name: 'vivo',
                price: 2399,
            },
            {
                name: 'oppo',
                price: 2499,
            },
        ]


        const ul = document.querySelector('ul')
        const input = document.querySelector('input')

        input.addEventListener('blur', function () {
            ul.innerHTML = ''//输入前先清空
           const newArr = arr.filter(function (item) {//筛选低于输入框的数据
                return item.price <= input.value
            })
            if (newArr.length !== 0) {
                newArr.forEach(function (item) {
                    let li = document.createElement('li')//创建li来填充数据
                    ul.appendChild(li)
                    li.innerHTML = item.name + item.price
                })
            } else {
                alert('没有找到符合地商品')
            }


        })


    </script>
</body>

</html>