API 參考
RenderJS 直接擴充原生建構子的 .prototype（src/prototype/*.ts），並非獨立 import 的模組。載入 bundle 後，以下所有方法即全域可用。
String
原始碼：src/prototype/String.ts
| 方法／屬性 | 說明 |
|---|---|
"selector".RJS(body) |
於符合選擇器的元素上啟動 RJS 實例；見 核心概念 |
"tag.class#id"._(attrs, children) |
依標籤選擇器字串建立真實 DOM 元素（含 SVG 命名空間偵測、input/textarea type/placeholder 解析、lazyload 屬性接線） |
"selector".$ |
取得符合的單一元素（#id 走 getElementById，其餘走 querySelector） |
"selector".$all |
取得所有符合元素的陣列（[...querySelectorAll(...)]） |
"icon-a icon-b"._fa |
Getter，建構 "i.icon-a.icon-b"._() —— 依空格分隔的 class 名稱產生 Font Awesome <i> 元素 |
"str".$json |
安全的 JSON.parse(this)；解析失敗時回傳 undefined（並記錄 log） |
"str".$$json |
$json 未失敗時為 true |
"str".$html |
HTML 逸出 、<、>、"、' |
"str".copy() |
非同步；透過 navigator.clipboard.writeText 寫入剪貼簿 |
"str".$regexp(flags?, force?) |
依字串建構 RegExp；force: true 會先逸出正則特殊字元 |
"str".$base64(mimeType) |
將 base64 字串解碼為 Blob |
"str".$$(filter?) |
正則測試、字串完全相等，或（無參數時）去除空白後非空的判斷 |
"url".$url |
new URL(this)，相對路徑時 fallback 為 new URL(location.origin + this) |
"url".$queryAll |
解析後的 query string 物件（透過 $url.$queryAll） |
"url".$img / $$200(isImg) / $req(body, once) / $query / _history(title) / _query(obj) / __history(title) / __query(obj) / query_(keys) / query__() |
轉發至下方 URL 對應的方法／getter，套用於 this.$url |
Element
原始碼：src/prototype/Element.ts
| 方法／屬性 | 說明 |
|---|---|
el.length |
this.children.length |
el.$i |
元素在父層子節點中的索引 |
el.$attributes |
所有屬性組成的 { name: value } 物件 |
el._(value) / el.__(value) |
新增／取代子節點——字串與數字轉為文字節點；純物件會格式化為 <br> 分行的 JSON |
el._style(map) / el._data(map) / el._attr(map) |
鏈式：依物件批次設定 style / dataset / attribute 鍵值 |
el._class(list) |
鏈式：新增一或多個 class（字串以逗號／空白／點分隔，或陣列） |
el.class_(list) / el.style_(list) / el.data_(list) / el.attr_(list) |
鏈式：移除 class／清除樣式／刪除 dataset 鍵／移除屬性 |
el.$style(key) / el.$data(key) / el.$attr(key) |
讀取單一樣式屬性／dataset 項目／屬性值 |
el.class__() |
鏈式：完全清空 className |
el.__class(list) |
鏈式：取代整個 class 列表 |
el.$$class(list) |
僅當 list 中每個 class 都存在時為 true |
el.$$class_(bool, list) |
鏈式：bool 為假時新增 list，為真時移除（省略 bool 時自動偵測目前狀態） |
el.$$data(key, value?) / el.$$attr(key, value?) |
dataset／屬性值等於 value 時為 true；省略 value 時檢查是否非空 |
el._children(...args) |
鏈式：透過 _child 逐一新增每個引數 |
el._child(value, before) |
鏈式：依索引或參照 Element 新增／插入子節點（或子節點陣列） |
el.__child(value) |
鏈式：取代子節點（replaceChildren） |
el.$child(value) |
依混合的選擇器字串與數字索引陣列查詢子節點 |
el.$parent(count) / el.$pre(count) / el.$next(count) |
沿 parentElement / previousElementSibling / nextElementSibling 走訪 count 步 |
el.$sel(selector) / el.$selAll(selector) |
有空值保護的 querySelector / querySelectorAll |
el._click(fn)（及所有 DOM 事件名，如 _input、_keydown、_touchstart、_drop 等） |
鏈式指定 on<event> = fn |
Array
原始碼：src/prototype/Array.ts
| 方法／屬性 | 說明 |
|---|---|
arr.$sum |
透過 reduce 計算數值陣列總和 |
arr.$shuffle |
原地 Fisher–Yates 洗牌；回傳 this |
arr.$map |
每個項目的 value → index 組成的 Map |
arr._(value, index?) |
支援負索引的插入（splice）；省略 index 時附加至末尾 |
arr.$(index) |
支援負索引的讀取 |
arr.$i(target) |
indexOf(target)，找不到時回傳 undefined 而非 -1 |
arr.$_(index) |
支援負索引的移除（splice） |
arr.$$(target?) |
無參數時判斷非空，有參數時判斷 target 是否存在 |
arr.$req(body) |
將陣列以 / 串接為 URL 路徑片段，再對該路徑呼叫 $req |
Object
原始碼：src/prototype/Object.ts（擴充 Object.prototype，故適用於純物件）
| 方法／屬性 | 說明 |
|---|---|
obj.length |
Object.keys(this).length |
obj.$keys / obj.$values |
Object.keys(this) / Object.values(this) |
obj.$map |
自身可列舉屬性組成的 Map |
obj.forEach(cb) |
類陣列迭代：對自身可列舉屬性執行 cb(key, value) |
obj._(key, value, replace = true) |
條件式設定——僅當 replace 為 true 時才覆蓋已存在的鍵 |
obj.$$(key?) |
有 key 時為 hasOwnProperty(key)，否則為 this.length > 0 |
URL
原始碼：src/prototype/URL.ts
| 方法／屬性 | 說明 |
|---|---|
url.$queryAll |
解析後的 query string 物件 |
url.$image |
回傳預先載入該 URL 圖片的 Promise |
url.$$200(isImg = false) |
fetch 該 URL；若回應為圖片，轉換為 object-URL blob（{ src, img }），除非是 SVG 且 isImg 為假 |
url.$req(body, once = false) |
fetch 封裝：JSON 或 FormData body（透過 body.json／body.files／body.tag）、自訂 header／credentials、以共用 Map（以 URL 為 key）去重請求、自動 JSON／文字回應解析，4xx/5xx 時以回應文字 reject |
url.$$query(key) |
searchParams.get(key) |
url._history(title?) |
對此 URL 執行 pushState，記錄至記憶體中的歷史堆疊，可選擇同步設定 document.title |
url._query(obj) |
回傳一個新 URL，將 obj 的鍵合併進現有 query string |
url.__history(title?) |
對此 URL 執行 replaceState（同步更新歷史堆疊） |
url.__query(obj) |
回傳一個新 URL，query string 整個由 obj 取代 |
url.query_(keys) |
回傳一個新 URL，移除指定的鍵（單一或陣列） |
url.query__() |
回傳一個新 URL，query string 已清空 |
window
原始碼：src/prototype/window.ts
| 方法 | 說明 |
|---|---|
_Listener(target?) |
無參數時同時啟用 lazyload 與 SVG 兩個 observer。有參數時，target.svg 決定是否啟用 lazyload observer，target.lazyload 決定是否啟用 SVG observer（observer 內部實作見 Listener 系統） |
$file(file) |
以 FileReader.readAsDataURL 包裝 File／Blob，於 load 事件時 resolve |
$cookie(key) |
讀取並 URI 解碼 cookie；若值看起來像 JSON 會自動 JSON.parse |
_cookie(key, body, expire = 3600) |
寫入 cookie（expire 單位為秒）；物件會先 JSON.stringify |
$(selector) |
模組層級的 "selector".$ 捷徑 |
$all(selector) |
模組層級的 "selector".$all 捷徑 |
_child(value, before) / __child(value) |
新增至／取代 document.body 的子節點 |
Date
原始碼：src/prototype/Date.ts
| 方法／屬性 | 說明 |
|---|---|
date.$y / $yy / $yyyy |
年（原始、兩位數、四位數） |
date.$M / $MM |
月，從 1 起算（原始、補零） |
date.$D / $DD |
日（原始、補零） |
date.$d / $dd / $ddd / $dddd |
星期：索引，接著依長度遞增的本地化名稱（英文縮寫或 zh locale 的「星期X」，依 navigator.language 偵測） |
date.$H / $HH |
24 小時制時（原始、補零） |
date.$h / $hh |
12 小時制時（原始、補零） |
date.$a / $A |
am／pm（小寫／大寫） |
date.$m / $mm |
分（原始、補零） |
date.$s / $ss |
秒（原始、補零） |
date.$S / $SS / $SSS |
毫秒，取 1／2／3 位數 |
date.$timestamp |
Unix 秒級時間戳 |
date.$gone |
人性化相對時間（"3 days"／"3天"、"Coming in..."／"還有..."，未滿 1 分鐘為 "recent"／"剛剛"），依 navigator.language 本地化 |
date.$format(format = "yyyy/MM/DD (ddd) HH:mm:ss") |
Token 式格式化；支援上表列出重複次數的 Y／M／D／H／h／m／s／S／A／a／d token |
date.$date(body?) |
依 { start }／{ end }／{ pre: { start } }／{ pre: { end } } 回傳當月或上個月的第一天／最後一天；否則回傳 new Date() |
Number
原始碼：src/prototype/Number.ts
| 方法／屬性 | 說明 |
|---|---|
n.$uniKey |
長度為 n 的隨機字串，取自 52 字元字母表，在該行程生命週期內去重 |
n.$ASCII |
String.fromCharCode(n) |
n.$date |
將 n 視為 Unix 秒級時間戳，回傳對應的 Date |
n.$y / $M / $D / $d / $H / $h / $a / $A / $m / $s / $S（及其補零／重複變體）／ $gone |
轉發至 n.$date 對應的 Date getter |
n.$format(format) |
轉發至 n.$date.$format(format) |
Map
原始碼：src/prototype/Map.ts
| 方法／屬性 | 說明 |
|---|---|
map.length |
this.size |
map.$keys / map.$values |
keys／values 的迭代器 |
map.$json |
Object.fromEntries(this) |
map._(key, value?) |
鏈式 set(key, value) |
map.$(key?) |
get(key) |
map.$_(key?) |
鏈式 delete(key) |
map.$$(key?) |
有 key 時為 has(key)，否則為 this.size > 0 |
Image
原始碼：src/prototype/Image.ts
| 方法／屬性 | 說明 |
|---|---|
img.copy(mime = "image/jpeg") |
非同步；透過 ClipboardItem 將圖片複製至剪貼簿 |
img.download(mime = "image/jpeg", filename?) |
以 object-URL <a download> 連結觸發瀏覽器下載 |
img.$base64(mime, size?) |
透過離屏 <canvas> 重新編碼；size（若小於最長邊）會等比例縮小圖片 |
img.$blob(mime, size?) |
將 $base64 解碼回 Blob |
HTMLElement
原始碼：src/prototype/HTMLElement.ts
| 方法／屬性 | 說明 |
|---|---|
el._display(value) |
鏈式 style.display = value |
el.width(v) / height(v) / paddingTop(v) / paddingLeft(v) / paddingBottom(v) / paddingRight(v) / marginTop(v) / marginLeft(v) / marginBottom(v) / marginRight(v) |
鏈式數值型樣式設定；純數字／數字字串會自動補上 px |
el.padding(top, right?, bottom?, left?) / el.margin(...) |
CSS 簡寫式鏈式設定（1–4 個引數，回退規則與 CSS padding／margin 屬性相同） |
el.scrollToX(value, animation?) / el.scrollToY(value, animation?) |
捲動至絕對位置（會限制在內容邊界內），可選擇 behavior: "smooth" |
el.scrollToT(animation?) / el.scrollToB(animation?) |
捲動至頂部／底部邊緣 |
el.scrollToL(animation?) / el.scrollToR(animation?) |
捲動至左側／右側邊緣 |
File
原始碼：src/prototype/File.ts
| 方法 | 說明 |
|---|---|
file.$image(isVideo = false) |
回傳 Promise<HTMLImageElement>。圖片透過 FileReader.readAsDataURL 解碼；影片檔（isVideo: true）則載入離屏 <video>、跳轉至第一個解碼畫格，並用 <canvas> 擷取產生 JPEG 縮圖 |
HTMLVideoElement
原始碼：src/prototype/HTMLVideoElement.ts
| 方法 | 說明 |
|---|---|
video._config({ preload, loop, muted, controls, playsinline, download, remote }) |
鏈式一次性設定：一律先透過 controlsList 停用原生下載／遠端播放 UI，再套用每個傳入旗標（download: false／remote: false 會重新加回對應的 controlsList token） |
HTMLFormElement
原始碼：src/prototype/HTMLFormElement.ts
| 方法／屬性 | 說明 |
|---|---|
form.$map |
表單欄位組成的 Map（透過內部 FormData 封裝） |
form.$json |
表單欄位組成的純物件 |
HTMLLinkElement
原始碼：src/prototype/HTMLLinkElement.ts
| 方法 | 說明 |
|---|---|
a._go(href?) |
鏈式：設定 href（若有給定）並在目前分頁導航（target = "_self"） |
a._open(href?) |
鏈式：設定 href（若有給定）並在新分頁導航（target = "_blank"） |
FormData
原始碼：src/prototype/FormData.ts
| 方法／屬性 | 說明 |
|---|---|
formData.$map |
條目組成的 Map |
formData.$json |
條目組成的純物件 |
DocumentFragment
原始碼：src/prototype/DocumentFragment.ts
| 方法／屬性 | 說明 |
|---|---|
fragment.innerHTML |
透過一個未掛載的 <div> 序列化片段內容 |
fragment.length |
this.children.length |
fragment._children(...args) |
逐一新增每個引數作為子節點 |
fragment._child(value) |
新增一個值（或值陣列）；字串／數字轉為文字節點 |