原创 jQuery實現qq音樂播放器項目-ajax跨域使用
頁面是pc端的頁面 主頁index.html包含了音樂播放暫停，上一首下一首切換，拖動進度條改變播放位置，刪除當前音樂，歌詞聯動變色等功能，數據是本地的json格式的文件點擊此處頁面效果 search_music.html,點擊主頁的l
2020-06-16 09:59:26
1
原创 Ajax的和HTML5元素拖放實現購物車功能
瀏覽器支持 Internet Explorer 9+, Firefox, Opera, Chrome, 和 Safari 支持拖動。 注意:Safari 5.1.2不支持拖動. 效果圖：當每一個黑色的div被拖動到灰色div中，灰色di
2020-06-16 09:59:26
原创 讓圖片和文字居中對齊的方法
如果一個盒子圖片，文字，在同一行上，怎麼實現文字始終對齊圖片的中間位置呢？ 方法就是使用vertical-align:middle;也就是給盒子都使用這個屬性，需要注意的是：這個屬性只對行內元素起作用,如果不是行內元素要加上diapla
2020-06-16 09:59:26
原创 flatMap
flatMap()方法對原數組的每個成員執行一個函數（相當於執行Array.prototype.map()），然後對返回值組成的數組執行flat()方法。該方法返回一個新數組，不改變原數組。 // 相當於 [[2, 4], [3, 6]
2019-07-30 18:16:31
原创 Array.from和slice
對於還沒有部署該方法的瀏覽器，可以用Array.prototype.slice方法替代。 //es6 const toArray = ((arg) => Array.from ? Array.from(arg) : arg => [].s
2019-07-30 18:16:31
原创 數組實例的 find() 和 findIndex()
數組實例的find方法，用於找出第一個符合條件的數組成員。它的參數是一個回調函數，所有數組成員依次執行該回調函數，直到找出第一個返回值爲true的成員，然後返回該成員。如果沒有符合條件的成員，則返回undefined。 [1, 4,
2019-07-30 18:16:31
原创 includes
//下面代碼用來檢查當前環境是否支持該方法，如果不支持，部署一個簡易的替代版本。 const contains = (() => Array.prototype.includes ? (arr, value) => arr.
2019-07-30 18:16:31
原创 JS監聽瀏覽器的返回事件
$(function(){ pushHistory(); window.addEventListener("popstate", function(e) { alert("監聽到返回按鈕事件啦"); //根據自己的需求實現
2019-01-27 00:49:32
1
原创 ie兼容性問題：頁面內容顯示不全，但不會出現滾動條
/* 頁面內容顯示不全，但不會出現滾動條*/ html { overflow-y: scroll; } :root { overflow-y: auto; overflow-x: hidden; } :root b
2018-12-23 17:42:11
2
原创 js獲取元素位置
obj.clientWidth //獲取元素的寬度（width+padding） obj.clientHeight //元素的高度 obj.offsetLeft //元素相對於父元素的left obj.offsetTop //元素相對於父
2018-11-12 23:26:26
2
原创 jQuery實現加入購物車飛入動畫效果之開發不停，填坑不止（起點位置在Y軸方向位置偏移）
開發時爲了完成購物車的飛入拋物線，因爲懶惰隨大流使用了fly.js插件，用的時候遇到的兩個坑坑~~ 1. 有滾動條時，拋物體的起點位置在Y軸方向上有位置偏移，偏大 2. 頁面有滾動條時，拋物體的結束位置不一樣，偏大 我：(⊙o⊙)…煩煩的
2018-11-04 07:26:29
3
原创 JQuery中的text(),html()和val()區別
text()定義和用法 text() 方法方法設置或返回被選元素的文本內容，如果有子標籤，則把子標籤內的文本一起返回，相當於js的innerText 代碼如下 <!DOCTYPE html> <html lang="en"> <head
2018-11-04 07:26:29
1
原创 媒體查詢常見媒體尺寸和設置
@media screen and (min-width:1200px){ ... }/* 大型設備（大臺式電腦，1200px 起） */ @media screen and (min-width:992px){ ... }/* 中型
2018-11-04 07:26:19
1