tag Javascript

標籤
貢獻1,356
1170
06:37 AM · Oct 27 ,2025
tuzixiansen_63d4d65909d62 頭像 invalidnull 頭像 icecreamlj 頭像 lengxi_16 頭像 yayu 頭像 u_15469972 頭像 tanking 頭像 codesheep_pro 頭像 u_15943685 頭像 refanbanzhang 頭像 hightopo 頭像 u_17141077 頭像

@Javascript / 博客 RSS 訂閱

refanbanzhang 頭像

熱飯班長 - flex佈局常見問題

flex無法創建滾動條 flex的孫元素使用overflow: auto無法出現滾動條 原因： 子元素沒有設置寬度，這會導致子元素的寬度由孫元素決定，從而子元素被撐大，孫元素無法達到出現滾動條的條件。 解決方案： 給子元素設置寬度，比如width:100%; flex佈局和文字溢出省略遭遇的問題 https://segmentfault.com/a/1190000045

react , flex , Css , 前端 , Javascript

收藏 評論

hightopo 頭像

hightopo - 圖撲 HT for Web 輕鬆構建組態拓撲結構

在現代的數據可視化和網絡管理中，拓撲圖是一種非常重要的工具。它可以直觀地展示節點(Node)和節點之間的關係(Edge)。無論是在 2D 還是 3D 環境中，拓撲圖都可以幫助我們更好地理解和管理複雜的系統。 然而，由於這些拓撲圖通常極為複雜，傳統的手動佈局方式不僅繁瑣且耗時。鑑於此，圖撲軟件自研 HT for Web 產品（以下簡稱為 HT）推出了自動佈局、彈力佈局插件，從根本上解決了這一問題。

佈局 , 拓撲圖 , 可視化 , 前端 , Javascript

收藏 評論

zch681990 頭像

太羽 - 基於viewUI框架自定義表單交互表格

template scrollContent :minusHeight='140' div class="zd-white-b" Table :columns="columns" :data="dataList" template #name="{ row, index }"

vue.js , iview , 前端 , Javascript

收藏 評論

kevinzhw 頭像

天涯學館 - Redux Toolkit：簡化Redux應用狀態管理

Redux Toolkit 是官方推薦用來簡化Redux開發的工具集。它包含了一些預設的最佳實踐，使得創建和管理Redux狀態變得更簡單。 1. 創建Store 使用configureStore函數來創建Redux store，它會自動配置中間件，如redux-thunk用於處理異步操作。 import { configureStore } from '@reduxjs/toolkit';

react , redux , 前端 , Javascript

收藏 評論

kevinzhw 頭像

天涯學館 - PWA離線優先策略：提升用户體驗的關鍵步驟

Progressive Web Apps (PWA) 的離線優先策略是通過Service Worker和Cache API實現的，它允許在沒有網絡連接時仍然可以訪問網站的部分或全部內容。 1. 創建Service Worker註冊文件（service-worker.js）： self.addEventListener('install', (event) = { event.waitUntil

pwa , 前端 , Javascript

收藏 評論

soujer 頭像

Soujer - AList嵌入動態驗證碼實現引流

前言 曉傑利用ALists創建了個網盤資源站，想着如何增加個動態驗證碼進行驗證後才能進行訪問下載，剛開始利用了固定的驗證碼，用户可以通過JS代碼中進行繞過或直接拿到驗證碼，經過曉傑多次優化，最終版本支持動態獲取驗證碼，使用了禁止打開控制枱校驗等方式減少繞過幾率，現在分享給大家。 AList介紹 ‌AList是一個支持多種存儲、支持網頁瀏覽和WebDAV的文件列表程序‌，AList的功能包括但不限於

網盤 , php , 驗證碼 , thinkphp , Javascript

收藏 評論

icecreamlj 頭像

一顆冰淇淋 - 從0到1：React項目中的Webpack配置實戰

公司項目一般都是使用集團封裝好的腳手架，腳手架內部實現咱看不到也摸不着，好不容易組內推行新的UI框架，需要自行定義 webpack 配置，這可是個絕佳的好機會，我對配置過程進行了梳理，把商業項目的成熟配置小跑着送上。 初始化 首先新建一個空文件夾，執行 npm init 初始化生成 package.json 文件。 創建 src 文件夾，項目的業務代碼都放在這裏，再創建 index.js，這是項目

react , webpack-dev-server , webpack , 前端 , Javascript

收藏 評論

minnanitkong 頭像

王大冶 - 5分鐘內理解 .prototype 鏈 | 2024

CSS技巧與案例詳解 vue2與vue3技巧合集 VueUse源碼解讀 在JavaScript的世界裏,原型(prototype)系統是一個常被討論但不易掌握的概念。作為JavaScript繼承模型的基石,理解原型對於構建大型應用或進行對象操作至關重要。讓我們一起探索這個迷人的話題,揭開原型系統的神秘面紗。 什麼是原型? 在JavaScript中,每個對象都有一個內部屬性[[Proto

ecmascript-6 , 前端 , Javascript

收藏 評論

gqkmiss 頭像

月恆 - JS 中 structuredClone 和 JSON.parse(JSON.stringify()) 克隆對象的區別

JavaScript 中 structuredClone 和 JSON.parse(JSON.stringify()) 克隆對象的異同點 一、什麼是 structuredClone？ 1. structuredClone 的發展 structuredClone 是在 ECMAScript 2021（ES12）標準中引入的，ECMAScript 2021 規範正式發佈於 2021 年 6 月 自 2

ecmascript-6 , clone , 前端 , Javascript

收藏 評論

renxingdebenma 頭像

renxingdebenma - MySQL常用指令碼

本文精心挑選了一系列MySQL指令碼，助你提升資料庫效率、解決常見問題，讓你的資料儲存體驗更加高效、可靠。 常用功能指令碼 1.匯出整個資料庫 mysqldump - u 使用者名稱- p – default - character - set = latin1 資料庫名匯出的檔名(資料庫預設編碼是latin1) mysqldump - u wcnc - p smgp_apps_wcnc

vue.js , MySQL , mysql優化 , npm , Javascript

收藏 評論

aqiongbei 頭像

aqiongbei - 來學一個值錢的知識，Chrome插件如何優雅的捕獲頁面的請求結果

背景 今天在寫一個某網站限流檢測的chrome插件，需要捕獲頁面的某個請求結果。那麼問題就來了，我們該如何捕獲頁面的請求結果呢？我們來捋捋都有哪些方案。 我開發的時候的配置為manifest_version: 3，下文內容也是在這個基礎上展開的。 本文只列舉方案，一些需同步在manifest_version進行配置地方並未提及，請自行配置。 可行的方案 一、chrome.webReques

chrome , chrome-extension , chrome-devtools , 前端 , Javascript

收藏 評論

refanbanzhang 頭像

熱飯班長 - chrome插件實現監聽ajax請求，然後修改請求參數

1 修改manifast.json manifest_version必須為3，因為這個declarativeNetRequest是3中新增的api { "manifest_version": 3, "permissions": ["declarativeNetRequest"], "host_permissions": ["all_urls"] } 2 在background.j

chrome-extension , typescript , 前端 , html5 , Javascript

收藏 評論

icecreamlj 頭像

一顆冰淇淋 - 全面掌握 Jest：從零開始的測試指南（下篇）

在上一篇測試指南中，我們介紹了Jest 的背景、如何初始化項目、常用的匹配器語法以及鈎子函數的使用。這一篇篇將繼續深入探討 Jest 的高級特性，包括 Mock 函數、異步請求的處理、Mock 請求的模擬、類的模擬以及定時器的模擬、snapshot 的使用。通過這些技術，我們將能夠更高效地編寫和維護測試用例，尤其是在處理複雜異步邏輯和外部依賴時。 Mock 函數 假設存在一個 runCallBac

單元測試 , 自動化測試 , jest , 前端 , Javascript

收藏 評論

momeak9 頭像

泯瀧 - 「譯」如何寫出更好的Typescript代碼

鏈接：https://medium.com/@technicadil_001/how-to-write-better-types... 作者：Debabrata Dash 原標題：How to write better Typescript codes? 在本文中，我們將討論大約 15 個編寫更好的 Typescript 代碼的技巧。 譯者：本文討論了 15 個實用技巧，以幫助開發者編

ecmascript-6 , typescript , HTML , 前端 , Javascript

收藏 評論

tanking 頭像

TANKING - jQuery國內大廠CDN加速鏈接

摘要 jQuery 的CDN有很多，但都很不穩定，例如國內的 bootcdn 經常抽風，還有其他的常見的例如 jQuery 官方的 code.jquery.com、jsDeliver、unpkg.com、staticfile，這些都是經常抽風的。導致使用了線上的CDN的頁面打開受到影響，那麼就沒有國內好用的CDN嗎？下面是我彙總的一些大廠的！ 大廠jQuery靜態資源CDN 百度 https://

cdn , jquery , jq , 前端 , Javascript

收藏 評論

nihaojob 頭像

秦少衞 - 使用 fabric.js 開發移動端 H5 圖片編輯器

大家好，我是開源圖片編輯器的 https://github.com/ikuaitu/vue-fabric-editor 的作者，它是一款基於 PC 版本的開源圖片編輯器。 最近很多開發者諮詢，是否可以將開源圖片編輯器改造為一款適用於移動端的 H5 版本圖片編輯器，最近 H5 版本的圖片編輯器剛剛上線，就將實現思路和產品細節整理成筆記分享出來，供大家參考。 基礎 開源的圖片編輯器的基本功能都

圖片 , fabric.js , 前端 , Javascript

收藏 評論

yangy5hqv 頭像

夢想雲圖網頁CAD - （WEB在線編輯DWG）在線CAD中實現測量圓、測量面積的方法

一、前言 本章將介紹如何利用mxcad插件實現在CAD圖紙中測量圓和測量面積的功能，用户點擊目標圓對象將自動標記出這個圓的半徑、面積值和周長值，同時可以自定義選擇標註文字的位置，測量圓功能能夠快速掌握目標圓對象的數據信息，方便統計工程量。 測量面積功能（多邊形、矩形）以多邊形的每一個頂點來確定多邊形的形狀和位置，通過點擊矩形的量角點來確定矩形的大小和位置，也可以自定義標註文字的位置。 二、測

ecmascript-6 , typescript , HTML , html5 , Javascript

收藏 評論

hu_qi 頭像

huqi - 跟魯迅重學 TypeScript | (五)異步處理、axios與封裝axios

“不在沉默中爆發，就在沉默中滅亡”，面對日益嚴峻的國際環境，我們祖國母親沒有繼續沉默，9月25日8時44分，洲際彈道導彈精準發射。，看到這個新聞，腰也不酸了，腿也不疼了，一口上上五樓，TS 學起來更帶勁了~ 異步處理 在 TypeScript 中，異步編程如同現代社會中的種種現象，紛繁複雜，令人眼花繚亂。而 async/await 正如那一柄利劍，能將這混沌的世界理清，使得程序員不至於深陷於回調的

Axios , typescript , Javascript

收藏 評論

vivo_tech 頭像

vivo互聯網技術 - 一次基於AST的大規模代碼遷移實踐

作者：來自 vivo 互聯網大前端團隊- Wei Xing 在研發項目過程中，我們經常會遇到技術架構迭代更新的需求，通過技術的迭代更新，讓項目從新的技術特性中受益，但由於很多新的技術迭代版本並不能完全向下兼容，包含了很多非兼容性的改變（Breaking Changes），因此我們需要設計一款工具，幫助我們完成大規模代碼自動遷移問題。本文簡單闡述了基於 AST 的代碼遷移概念和大致流程，並通過代碼案

ast , 代碼遷移 , 抽象語法樹 , postcss , Javascript

收藏 評論

minnanitkong 頭像

王大冶 - 使用 React Query 時還需要 Redux 嗎？| 狀態管理 2024

React Hook 深入淺出 CSS技巧與案例詳解 vue2與vue3技巧合集 VueUse源碼解讀 隨着前端技術的不斷髮展，狀態管理一直是React應用開發中的核心問題。Redux作為長期佔據主導地位的狀態管理庫，為開發者提供了可預測的狀態容器和強大的生態系統。然而，隨着React Query等新興工具的出現，開發者們開始重新思考狀態管理的最佳實踐。本文將深入探討在2024年的前

ecmascript-6 , 前端 , Javascript

收藏 評論

refanbanzhang 頭像

熱飯班長 - 給線條類型的svg圖標加上繪製的動畫效果

效果展示 步驟分解 1 確認svg文件有路徑數據 2 獲取path的長度 3 定義繪製線條的長度 4 定義關鍵幀動畫 5 應用關鍵幀動畫 實操 1 確認svg文件有路徑數據 path標籤裏面的d屬性，就是路徑數據 template svg fill="none" xmlns="http://www.w3.org/2000/svg" width="260" hei

animation , css3動畫 , keyframes , 前端 , Javascript

收藏 評論

icecreamlj 頭像

一顆冰淇淋 - 前端模塊化進化史：從全局 function 到 ES Modules

目前，前端開發已經離不開由 CommonJS、ES Modules 和 Webpack 構建的模塊化開發環境。無論是 JavaScript、CSS、圖片還是其他資源，都可以作為一個模塊來處理。那麼，模塊化究竟是如何發展到今天的呢？ 全局函數模式 最初的前端模塊化嘗試是通過 全局函數來實現的。例如，在一個 util.js 文件中定義了一個變量 count 和一個工具函數 formatNumberWi

amd , commonjs , es-modules , 前端 , Javascript

收藏 評論

linong 頭像

linong - 通過 AST 實現組件庫替換升級

年初接到一個任務將 semi-ui 替換到 antd，但是能人力預算不太夠，所以基於工作量和效率選擇了基於 AST 的替換方案。 項目技術棧是 React + tsx 為什麼要使用 AST？ AST（Abstract Syntax Tree，抽象語法樹）是一種在計算機科學中表示源代碼語法結構的樹狀數據結構。 通過 AST，可以理解代碼的結構和含義，實現代碼分析、轉換和操作。 基於 AS

ast , typescript , babel , 前端 , Javascript

收藏 評論

minnanitkong 頭像

王大冶 - 如何複製由自定義元素組成的網頁的 HTML 代碼

React Hook 深入淺出 CSS技巧與案例詳解 vue2與vue3技巧合集 VueUse源碼解讀 有時我們需要獲取某個網頁HTML的本地副本,例如作為測試的輸入。 但複製網頁或元素的HTML並不總是直截了當的。現代網站往往由自定義元素構建。自定義元素通常是影子宿主。影子宿主的 innerHTML 或 outerHTML 屬性只返回直接子元素的HTML,而忽略了包含的影子DOM的

ecmascript-6 , typescript , 前端 , Javascript

收藏 評論