原创 跨站請求僞造—CSRF
CSRF 介紹 CSRF，是跨站請求僞造（Cross Site Request Forgery）的縮寫，是一種劫持受信任用戶向服務器發送非預期請求的攻擊方式。 通常情況下，CSRF 攻擊是攻擊者藉助受害者的 Cookie 騙取服務
2020-06-21 12:47:16
1
原创 JavaScript導出excel文件，並修改文件樣式
說明 因爲最近需要實現前端導出 excel 文件，並且對導出文件的樣式進行一些修改，比如顏色、字體、合併單元格等，所以我找到了 xlsx-style 這個項目，它可以對導出的 excel 文件進行一些樣式上的修改，這個項目是 Sh
2020-06-11 17:44:39
113
原创 畢業一年時的反思
寫這篇文章是想反思反思畢業後的這第一年，這篇文章不會提任何的技術，但是講的笑話會挺多。 開始正文 離開校園，步入社會後，我到的第一家公司是一家創業公司，有趣的是，某一段時間，我的辦公室變得非常的大，我估算應該是有 400 平米了
2020-06-11 17:44:39
原创 簡單說 CSS濾鏡 filter屬性
說明 濾鏡主要是用來實現圖像的各種特殊效果，css的濾鏡是很神奇的。 解釋 css的濾鏡，也就是filter屬性，主要有下面這幾個屬性值 blur（模糊） brightness（亮度） 注意：值是100%，圖像無變
2020-02-22 03:31:04
原创 簡單說 如何做一個chrome 去廣告插件
說明 Chrome插件又稱爲谷歌瀏覽器插件,是谷歌Chrome瀏覽器的擴展插件,使用Chrome插件可以爲Chrome瀏覽器帶來一些功能性的擴展,進而提高Chrome的使用體驗。 這次我們先來簡單接觸一下，瞭解一點入門知識，先
2020-02-22 03:31:04
原创 JavaScript數組去重—ES6的兩種方式
說明 JavaScript數組去重這個問題，經常出現在面試題中，以前也寫過一篇數組去重的文章，（JavaScript 數組去重的多種方法原理詳解）但感覺代碼還是有點不夠簡單，今天和大家再說兩種方法，代碼可是足夠的少了。 解釋 方法
2020-02-22 03:31:04
原创 簡單說 background-color 與 backgroundColor的區別
說明 我們先來看看出了什麼問題。 <!doctype html> <html lang="zh"> <head> <meta charset="utf-8"> </head> <body style="bac
2020-02-22 03:31:04
原创 簡單說 通過JS控制CSS的各種方式（上）
說明 通過JS控制CSS，我們能做出更多漂亮的頁面特效，做出更炫的交互效果。今天我們來說說JS控制CSS的各種方式。 解釋 JavaScript、CSS、HTML是前端三劍客，我們說正事之前，先來說說CSS與HTML的
2020-02-22 03:31:04
原创 簡單說 CSS中的 object-fit 與 object-position
說明 問題： 一個div寬度不固定，高度固定，採用Flex佈局，它裏面有兩個元素一個img寬度佔40%，高度佔100%，一個p元素，寬度佔60%，高度佔100%，調整瀏覽器窗口大小，要保證，img元素不變形，寬高比不變，怎麼辦！
2020-02-22 03:31:04
原创 跨站腳本攻擊—XSS
XSS 介紹 XSS 是跨站腳本攻擊（Cross Site Scripting）的簡寫，但是從首寫字母命名的方式來看，應該取名 CSS，但這樣就和層疊樣式表（Cascading Style Sheets，CSS）重名了，所以取名爲
2019-09-16 21:36:55
原创 CSS 繪製各種形狀
說明 使用 CSS 可以繪製出許多形狀，比如三角形、梯形、圓形、橢圓，等 並不只是可以繪製矩形。下面來看看怎麼實現這些形狀的吧。爲了容易理解，文章分爲基本形狀 和 組合形狀來說，基本形狀是比較容易實現的，而利用這些基本形狀進行組合，就可以實
2019-03-28 20:35:07
4
原创 學習 PixiJS — 小精靈冒險
說明 小精靈冒險 是 Learn Pixi.js 一書中最後一個案例。點擊屏幕讓小精靈飛起來，小精靈上升時，會拍打翅膀，並且會有小星星產生。如果她撞到柱子上，她會爆炸成一堆小星星。幫助她通過15個柱子的間隙到達終點，界面會顯示一個巨大 Fi
2019-03-11 21:35:07
3
原创 學習 PixiJS — 交互工具
說明 Pixi 內置一組功能有限的用於鼠標交互和觸摸交互的方法，但是對於遊戲和應用程序所需的豐富交互性，建議使用第三方庫來簡化操作，這篇文章介紹的是 Tink 庫，它有通用的指針對象、拖放精靈、按鈕對象、鍵盤控制 等一些有用的功能。
2019-03-06 15:42:11
3
原创 學習 PixiJS — 碰撞檢測
說明 碰撞檢測，用來檢查兩個精靈是否接觸。 Pixi 沒有內置的碰撞檢測系統， 所以這裏我們使用一個名爲 Bump 的庫，Bump 是一個易於使用的2D碰撞方法的輕量級庫，可與 Pixi 渲染引擎一起使用。它提供了製作大多數2D動作遊戲所需
2019-02-25 11:45:02
29
原创 學習 PixiJS — 補間動畫
說明 補間動畫指的是，我們可以通過爲精靈的位置、比例、透明度，等屬性，設置開始值和結束值，製作動畫，動畫中間需要的部分由軟件自動計算填充。 Pixi 沒有內置補間引擎，但是你可以使用很多很好的開源的補間庫，比如 Tween.js 和 Dyn
2019-02-19 06:48:50