题解 | #数组过滤#
数组过滤
https://www.nowcoder.com/practice/46d607f9bf64458daa8798339a7336d0
{"html":"<!DOCTYPE html>\r\n<html lang=\"en\">\r\n <head>\r\n <meta charset=\"UTF-8\">\r\n </head>\r\n <body>\r\n <select name=\"\" id=\"\">\r\n <option value=\"0\">请选择价格范围</option>\r\n <option value=\"1\"><100</option>\r\n <option value=\"2\">100~500</option>\r\n <option value=\"3\">>500</option>\r\n </select>\r\n <ul>\r\n <li>牛客logo马克杯</li>\r\n <li>无盖星空杯</li>\r\n <li>老式茶杯</li>\r\n <li>欧式印花杯</li>\r\n </ul>\r\n\r\n <script>\r\n var cups = [\r\n { type: 1, price: 100, color: 'black', sales: 60, name: '牛客logo马克杯' },\r\n { type: 2, price: 40, color: 'blue', sales: 100, name: '无盖星空杯' },\r\n { type: 4, price: 60, color: 'green', sales: 200, name: '老式茶杯' },\r\n { type: 3, price: 50, color: 'green', sales: 600, name: '欧式印花杯' }\r\n ]\r\n var select = document.querySelector('select');\r\n var ul = document.querySelector('ul');\r\n // 补全代码\r\n select.onchange = function(event){\r\n let arr = cups.filter((item) =>{\r\n switch(parseInt(this.value)){\r\n case 1: \r\n return item.sales < 100\r\n break\r\n case 2:\r\n return item.sales >= 100 && item.sales <=500\r\n break\r\n case 3:\r\n return item.sales > 500\r\n break\r\n }\r\n })\r\n ul.innerHTML = \"\"\r\n arr.forEach((item)=>{\r\n ul.innerHTML += `<li>${item.name}</li>`\r\n })\r\n }\r\n </script>\r\n </body>\r\n</html>","css":"/* html, body {\\n\\twidth: 100%;\\n\\theight: 100%;\\n\\tmargin: 0;\\n\\tpadding: 0;\\n} */","js":"// 请在这里输入代码"}