{"id":230539,"student_id":3469,"content":"{\"html\":\"\u003c!DOCTYPE html\u003e\\n\u003chtml\u003e\\n\u003chead\u003e\\n\\t\u003ctitle\u003eDocument\u003c/title\u003e\\n\\t\u003cscript src=\\\"https://cdn.jsdelivr.net/npm/vue/dist/vue.js\\\"\u003e\u003c/script\u003e\\n\u003c/head\u003e\\n\u003cbody\u003e\\n \u003ch1\u003e購物商品\u003c/h1\u003e\\n \u003cdiv class=\\\"btn-group\\\"\u003e\\n \u003cbutton onclick=\\\"order_by_price_asc()\\\"\u003e價格由低到高\u003c/button\u003e\\n \u003cbutton onclick=\\\"order_by_price_desc()\\\"\u003e價格由高到低\u003c/button\u003e\\n \u003cbutton onclick=\\\"order_by_like_asc()\\\"\u003e評價由低到高\u003c/button\u003e\\n \u003cbutton onclick=\\\"order_by_like_desc()\\\"\u003e評價由高到低\u003c/button\u003e \\n \u003c/div\u003e\\n \\n \u003ctable id=\\\"root\\\"\u003e\\n \u003ctr\u003e\\n \u003cth\u003e商名稱\u003c/th\u003e\\n \u003cth onclick=\\\"orderByPrice()\\\"\u003e價格\u003c/th\u003e\\n \u003cth onclick=\\\"orderByLike()\\\"\u003e評價\u003c/th\u003e\\n \u003c/tr\u003e\\n \u003c!-- 特殊用法,有空再查! --\u003e\\n \u003ctr v-for=\\\"d in data\\\"\u003e\\n \u003ctd\u003e{{d.name}}\u003c/td\u003e\\n \u003ctd\u003e$ {{d.price}}\u003c/td\u003e\\n \u003ctd\u003e\u0026#11088;{{d.like}}\u003c/td\u003e\\n \u003c/tr\u003e\\n \u003c!-- 特殊用法,有空再查! --\u003e\\n \u003c/table\u003e\\n\u003c/body\u003e\\n\u003c/html\u003e\",\"css\":\"body {\\n padding: 30px;\\n}\\n\\n.btn-group {\\n text-align: center;\\n padding: 15px;\\n}\\n\\nh1 {\\n text-align: center;\\n}\\n\\ntable {\\n border-collapse: collapse;\\n width: 80vw;\\n margin: auto;\\n}\\n\\nth, td {\\n text-align: left;\\n padding: 10px;\\n}\\n\\ntr:nth-child(even) {\\n background-color: #f2f2f2;\\n}\",\"js\":\"var data = [\\n { name: '雙效防蛀護齒牙膏', price: 299, like: 4 },\\n { name: '旅充式行動電源', price: 1980, like: 300 },\\n { name: '幫寶適一級幫紙尿褲', price: 1239, like: 798 },\\n { name: '任天堂Switch豪華防摔旅行收納包', price: 650, like: 201 },\\n { name: '抗敏系列空氣清淨機', price: 24900, like: 9 },\\n { name: '麥香奶茶300ml (24入)', price: 240, like: 22 },\\n { name: '德國護色去汙超濃縮洗衣精', price: 199, like: 79 },\\n { name: '純萃柔感抽取式衛生紙', price: 869, like: 53 },\\n { name: 'LOTTE 小熊餅乾-巧克力', price: 149, like: 102 },\\n { name: 'Apple iPhone 11 (64G)', price: 24900, like: 2 },\\n];\\n\\n// 價格由低到高\\nfunction order_by_price_asc () {\\n data.sort(function(a, b) {\\n return a.price - b.price;\\n });\\n}\\n\\n// 價格由高到低\\nfunction order_by_price_desc () {\\n data.sort(function(a, b) {\\n return b.price - a.price;\\n });\\n}\\n\\n// 評價由低到高\\nfunction order_by_like_asc () {\\n data.sort(function(a, b) {\\n return a.like - b.like;\\n });\\n}\\n\\n// 評價由高到低\\nfunction order_by_like_desc () {\\n data.sort(function(a, b) {\\n return b.like - a.like;\\n });\\n}\\n\"}","created_at":"2021-02-21T13:56:27.914+08:00","updated_at":"2021-02-21T14:13:44.435+08:00","name":"內建排序練習(2)預設版 副本","language":"web","screenshot":{"url":"https://cdn1.koding.school/uploads/project/screenshot/230539/5e5526315f504db772640813de11eddb.jpg"},"parent_id":148159,"plugin":"setTimeout(function() {\n new Vue({\n el: '#root',\n data: function () {\n return { data: window.data }\n }\n }); \n});\n\n","description":null,"note":null,"status":"public","like_student_ids":[],"is_featured":false,"views":90,"hashid":"36ysmyqgm","is_content_changed":false,"review_status":"unsubmitted","submitted_at":null,"reviewed_at":null,"advise":null,"is_deleted":false}
[]
橘蘋學習平台
橘蘋學習平台
我的作品
檢視專案頁
匯出
複製
匯入
刪除
下載 Android APP (APK)
截圖
前往網站頁面
1:1:1
1:1
full
用手機掃描下方 QRCode 進行安裝
或您也可以
下載 APK
到這台電腦
用手機掃描下方 QRCode 進行安裝
或您也可以
下載 APK
到這台電腦