tag 前端

標籤
貢獻1,071
2840
06:37 AM · Oct 27 ,2025
tuzixiansen_63d4d65909d62 頭像 smileZAZ 頭像 qaz666 頭像 opentiny 頭像 invalidnull 頭像 dirackeeko 頭像 beishangdejianjidan_cqxuxf 頭像 yayu 頭像 junxiudetuoba 頭像 jdcdevloper 頭像 icecreamlj 頭像 xixindehongjiu 頭像

@前端 / 博客 RSS 訂閱

2021_60e2de6ea45f7 頭像

前端知識搬運工 - flex佈局製作自適應網頁

網頁佈局是css的一個重點應用。傳統的佈局都是依賴display、position、float屬性來實現的，但是特殊佈局就不易實現，如垂直居中。 01 flex佈局是什麼？‍ Flex 是 Flexible Box的簡寫，意為“彈性佈局”為盒模型提供最大靈活性。任何一個容器都可以指定為flex佈局。 採用flex佈局的元素，稱為flex容器。他的所有子元素自動成為容器成員，稱為flex項目，簡稱項

flexbox , Css , 前端

收藏 評論

c_z7wgq 頭像

前端學長Joshua - POST請求 之 對數據進行編碼處理

POST請求 之 對數據進行編碼處理 !-- TOC -- URLSearchParams URLSearchParams 的讀取和轉換操作 url.searchParams 讓 URLSearchParams 作為Fetch的請求體(body) FormData 讓 FormData 作為Fetch的請求體(body) 轉換為

網絡請求 , post , content-type , 編碼 , 前端

收藏 評論

grapecity 頭像

葡萄城技術團隊 - 從頁面加載到數據請求，前端頁面性能優化實踐分享

背景 做過前端開發都知道前端的工作內容是很多的，對於HTML、CSS、Javascript、Image、Flash等各種內容的使用。為了更好提升應用的性能，我們需要對各種資源內容進行不同方面的優化。 對用户而言，優化可以讓應用的響應速度加快，加載更加迅速，可以帶來更好的使用體驗。 對於服務商而言，前端優化能夠減少頁面請求數量，寬帶所佔帶寬，有效的節省資源。 前端優化的內容很多，按照粒度等級劃

websocket , spreadjs , 前端優化 , 前端

收藏 評論

molufange 頭像

陌路凡歌 - Nginx配置單頁應用

上一期我們講了如何在一個新服務器上用Nginx跑起一個前端項目，但是還有很多缺陷，比如我們想在這個Nginx下跑多個項目怎麼辦，spa單頁項目常見的刷新空白原因及處理等等，本篇將一一介紹。 同端口多項目配置 假設我們有兩個單頁項目，一個pc官網，一個mobile官網，我們都想跑在上期8082端口上，這時候發現我們上一期部署的文件夾是直接放在www目錄下的，這可不行，文件全放這下面都不能區分是哪個項

單頁面應用 , Nginx , spa , 前端

收藏 評論

invalidnull 頭像

註銷 - 將您的基於 Accelerator 的 SAP 電商雲 Storefront 遷移到 Spartacus Storefront

原文：Migrate Your Accelerator-based Storefront to Project Spartacus 如果您已閲讀過“遷移到 Spartacus javascript storefront 項目的五個原因”和“SAP Commerce Cloud Project Spartacus 入門”這兩篇文章，您可能想要遷移到基於無狀態高性能架構的 storefront, 並且

vue.js , sap , spa , 前端 , Javascript

收藏 評論

invalidnull 頭像

註銷 - 使用瀏覽器的 Local Storage 真的安全嗎？

LocalStorage 是一個 HTML5 網絡存儲對象，用於將數據存儲在客户端——即本地，在用户的計算機上。 本地存儲的數據沒有到期日期，並且會一直存在，直到被刪除。 （相比之下，會話存儲是另一個 HTML5 網絡存儲 API，它會在瀏覽器關閉時刪除存儲的數據。） 本地存儲是純 JavaScript。 同樣，雖然它仍然在用户的設備上生成純文本文檔，但本地存儲也允許存儲多達 5MB 的數據（與

react , vue.js , localstorage , 前端 , Javascript

收藏 評論

lishisan 頭像

李十三 - 前端構建這十年

寫在前面 前端模塊化/構建工具從最開始的基於瀏覽器運行時加載的 RequireJs/Sea.js 到將所有資源組裝依賴打包 webpack/rollup/parcel的bundle類模塊化構建工具，再到現在的bundleless基於瀏覽器原生 ES 模塊的 snowpack/vite，前端的模塊化/構建工具發展到現在已經快 10 年了。 本文主要回顧 10 年間，前端模塊化/構建工具的發展歷程及

構建工具 , vite , webpack , 模塊化開發 , 前端

收藏 評論

qifengliao_5e7f5b20ee3bd 頭像

起風了 - 封裝一個方法，獲取頁面url中的參數值？

封裝一個方法獲取頁面url參數，可作為框架基礎方法使用： //獲取url參數; 正則獲取url參數，包含hash[#]和search[?]兩種通用 export function getUrlQueryByName(param) { const reg = new RegExp('(^|)' + param + '=([^]*)(|$)'); const r = window.lo

regexp , 前端 , Javascript

收藏 評論

pinmingxueqianduandelaji 頭像

bug之所措 - package.json的認識

前言 感覺這塊也是一個知識點，雖然我現在還不能系統的用xmind總結每個知識點的串聯關係，但是隻能看一個記一個了 package.json是什麼 我個人理解，package.json是描述包，管理包的一個信息json文件，給npm用的，比如你可以寫一個包，發到npm，那這個json就是記錄這個包的信息，或者對用vue腳手架開發的項目而言，它就是管理包的文件，npm install會讀這個文件的de

gulp , vue.js , 工程化 , npm , 前端

收藏 評論

king2088 頭像

深夜徘徊 - 我用ionic擼了一個USB轉串口的調試工具

由於最近應產品經理的需求，需要做一個Android版的上位機APP，為此專門到某寶上購買了一個Type-C轉串口的小設備，然後就開始折騰了。花了幾天的時間就把上位機APP做出來了，後來在空閒時間又做了一個串口調試的小工具，效果如下圖 創建項目 ionic start blank 創建一個空白項目 安裝串口插件 要做一個串口通訊的工具，那就得和硬件打交道，正好根據ionic官方文檔，我找到了一個串

ionic , angular , 串口 , typescript , 前端

收藏 評論

shanejix 頭像

shanejix - 現代 JavaScript 教程 —— JavaScript 編程語言篇

摘自 現代 JavaScript 教程;總結自己覺得重要/疏忽/未知的部分，閒來無事時看看，抓耳撓腮時看看。長篇預警！ ECMA-262 規範 最權威的信息來源(語言細節)，每年都會發佈一個新版本的規範 🚩最新的規範草案請見 https://tc39.es/ecma262/ 🚩最新最前沿的功能，包括“即將納入規範的”（所謂的 “stage 3”），請看這裏的提案 https://gith

前端工程師 , frontend , 前端 , Javascript

收藏 評論

huaweiclouddeveloper 頭像

華為雲開發者聯盟 - 學會這5種JS函數繼承方式，前端面試你至少成功50%

摘要：函數繼承是在JS裏比較基礎也是比較重要的一部分，而且也是面試中常常要問到的。下面帶你快速瞭解JS中有哪幾種是經常出現且必須掌握的繼承方式。掌握下面的內容面試也差不多沒問題啦~ 本文分享自華為雲社區《人類高質量JS函數繼承》，作者：北極光之夜。 一. 前言： 函數繼承是在JS裏比較基礎也是比較重要的一部分，而且也是面試中常常要問到的。下面帶你快速瞭解JS中有哪幾種是經常出現且必須掌握的繼

函數 , 面試 , 繼承 , 前端 , Javascript

收藏 評論

ruochuan12 頭像

若川 - 50行代碼串行Promise，koa洋葱模型原來是這麼實現？

1. 前言 大家好，我是若川。歡迎關注我的公眾號若川視野，最近組織了源碼共讀活動《1個月，200+人，一起讀了4周源碼》，感興趣的可以加我微信 ruochuan12 參與，長期交流學習。 之前寫的《學習源碼整體架構系列》 包含jQuery、underscore、lodash、vuex、sentry、axios、redux、koa、vue-devtools、vuex4十餘篇源碼文章。其中最新的兩篇是

node.js , koa , koa.js , 前端 , Javascript

收藏 評論

barrior 頭像

Barrior - 小程序或移動端『滾動穿透』與『滾動溢出』解決方案

滾動穿透 問題描述 在移動端 WEB 開發的時候（小程序也雷同），如上錄屏所示，如果頁面超過一屏高度出現滾動條時，在 fixed 定位的彈窗遮罩層上進行滑動，它下面的內容也會跟着一起滾動，看起來好像事件穿透到下面的DOM元素上一樣，我們姑且稱之為滾動穿透。 問題原因 能夠猜想是文檔（document）的滾動事件被觸發了，如果能禁用滾動事件就好辦了。 案例偽代碼 div class="btn"點擊

移動web開發 , 小程序 , 前端

收藏 評論

invalidnull 頭像

註銷 - Angular CLI 全局 ng.cmd 文件內容分析

文件內容如下： REM Jerry ::這是註釋 @ECHO off SETLOCAL CALL :find_dp0 IF EXIST "%dp0%\node.exe" ( SET "_prog=%dp0%\node.exe" ) ELSE ( SET "_prog=node" SET PATHEXT=%PATHEXT:;.JS;=;% ) "%_prog%" "%dp0%\no

angularjs , angular , cli , typescript , 前端

收藏 評論

camille_5f9b7f6b8693f 頭像

牛仔碼農 - Javaweb入門完整版學習教程，簡單粗暴，通俗易懂！

JavaWeb是用Java技術來解決相關web互聯網領域的技術總和，Java提供了技術方案可以解決客户端和服務器端的實現。 web包括：web服務器和web客户端兩部分。 Java在客户端的應用有 java applet，不過使用得很少，Java在服務器端的應用非常的豐富，比如Servlet，JSP和第三方框架等等。 Java技術對Web領域的發展注入了強大的動力。 目前，Java Web開

servlet , JAVA , jsp , 後端 , 前端

收藏 評論

susuhhhhhh 頭像

用户bPcSPjP - 微信小程序實現歷史搜索功能（h5同理）

1.實現效果 2.實現原理 將數據存在storage中。 wx.setStorageSync('search_history', JSON.stringify(this.data.list)) 取數組前15條。 if (wx.getStorageSync('search_history') ){ this.setData({ list:JSON.parse(wx.get

小程序 , localstorage , 緩存 , storage , 前端

收藏 評論

xiaohuaihuai_5e74ba460d087 頭像

小壞壞 - JS語言特性（下）

調包   即引用其他項目或者文件。   之所以需要把這個模塊單獨拎出來，是因為，一個語言能不能成氣候的其中的一個關鍵點在於能否模塊化；一個項目能否形成一個可觀的體量也離不開模塊化，簡單來説就是不同文件或項目間能否互相調用，es5和es6中都有着不同風格的引用方式，開發時要注意自己的開發環境以及語法格式 es5   有着AMD、CMD、CommonJS三種的引用方式，其中AMD（Asynchrono

ecmascript-6 , node.js , es5 , 前端 , Javascript

收藏 評論

_6085362b65292 頭像

HZFEStudio - ES5、ES6 如何實現繼承

完整高頻題庫倉庫地址：https://github.com/hzfe/aweso... 完整高頻題庫閲讀地址：https://febook.hzfe.org/ 相關問題 關於 ES5 和 ES6 的繼承問題 原型鏈概念 回答關鍵點 原型鏈繼承 構造函數繼承 ES6 類繼承 繼承是指子類型具備父類型的屬性和行為，使代碼得以複用，做到設計上的分離。JavaScript 中的繼承主要通過原型鏈和

ecmascript-6 , 繼承 , 原型鏈 , 前端 , Javascript

收藏 評論

bencjl 頭像

BENCJL - 嘗試檢測移動端click延時

據説移動端click有個延時300ms響應的機制，目的是為了區分單擊、雙擊。如果300ms內再次點擊，則判定為雙擊，移動端的雙擊用於縮放頁面；否則為單擊，執行click的事件處理函數。 取消click延時響應的3種做法： 設置視口標籤，禁用縮放頁面功能，瀏覽器也會相應取消對雙擊的響應。 利用touch系列事件包裝一組監聽器，只有touch持續時間小於某個值才歸為點擊（大於就是長按或者拖

移動端web , 前端 , Javascript

收藏 評論

_6085362b65292 頭像

HZFEStudio - New 操作符的原理

完整高頻題庫倉庫地址：https://github.com/hzfe/awesome-interview 完整高頻題庫閲讀地址：https://febook.hzfe.org/ 相關問題 new 操作符做了什麼 new 操作符的模擬實現 回答關鍵點 構造函數 對象實例 new 操作符通過執行自定義構造函數或內置對象構造函數，生成對應的對象實例。 知識點深入 1. new 操作符做了什麼

面試 , new , es5 , 前端 , Javascript

收藏 評論

patelo 頭像

patelo - vue多項目多模塊運行/打包

vue多項目多模塊運行/打包 vue-cli4 為例，實現多項目的分模塊打包。多項目之間共享組件和依賴，運行、打包互不干擾。 一、安裝 npm install -g @vue/cli # OR yarn global add @vue/cli 二、創建項目： vue create my-project # OR vue ui 三、目錄改造 所謂分模塊打包，一個模塊就是一個獨立項目，各個模塊

vue.js , yarn , webpack4 , 前端 , Javascript

收藏 評論

chenxiang_594a1cea112c2 頭像

阿古達木 - ExpiredStorage-給localstroage增加超時功能 源碼解讀

https://www.npmjs.com/package... 這個庫拓展了localStroage。在設置item的時候，會另外再設置一個key用來存儲過期時間。當在取數據的時候判斷是否過期並且remove元素。 用法 expiredStorage = new ExpiredStorage(); // 60秒後過期 expiredStorage.setItem("test", "fo

localstorage , 前端 , Javascript

收藏 評論

onlythinking 頭像

編程碼農 - 前端-JavaScript中的class

類 類是用於創建對象的模板。JavaScript中生成對象實例的方法是通過構造函數，這跟主流面嚮對象語言（java，C#）寫法上差異較大，如下： function Point(x, y) { this.x = x; this.y = y; } Point.prototype.toString = function () { return '(' + this.x + ', ' + t

類 , 繼承 , 原型鏈 , 前端 , Javascript

收藏 評論