SVGSVGElement

Baseline 廣泛可用 *

此特性已相當成熟,可在許多裝置和瀏覽器版本上使用。自 ⁨2015 年 7 月⁩以來,各瀏覽器均已提供此特性。

* 此特性的某些部分可能存在不同級別的支援。

SVGSVGElement 介面提供了對 <svg> 元素的屬性的訪問,以及操作它們的方法。此介面還包含各種雜項常用工具方法,例如矩陣操作以及控制視覺渲染裝置重繪時間的能力。

EventTarget Node Element SVGElement SVGGraphicsElement SVGSVGElement

例項屬性

此介面還繼承了其父介面 SVGGraphicsElement 的屬性。

SVGSVGElement.x 只讀

一個 SVGAnimatedLength 物件,對應於給定 <svg> 元素的 x 屬性。

SVGSVGElement.y 只讀

一個 SVGAnimatedLength 物件,對應於給定 <svg> 元素的 y 屬性。

SVGSVGElement.width 只讀

一個 SVGAnimatedLength 物件,對應於給定 <svg> 元素的 width 屬性。

SVGSVGElement.height 只讀

一個 SVGAnimatedLength 物件,對應於給定 <svg> 元素的 height 屬性。

SVGSVGElement.viewBox 只讀

一個 SVGAnimatedRect 物件,對應於給定 <svg> 元素的 viewBox 屬性。

SVGSVGElement.preserveAspectRatio 只讀

一個 SVGAnimatedPreserveAspectRatio 物件,對應於給定 <svg> 元素的 preserveAspectRatio 屬性。

SVGSVGElement.pixelUnitToMillimeterX 已廢棄

一個浮點數,表示視口 X 軸上畫素單位(由 CSS2 定義)的大小,其範圍約為 70dpi 到 120dpi,並且在支援此功能的系統上,可能實際與目標介質的特性匹配。在無法知道畫素大小的系統上,將提供一個合適的預設畫素大小。

SVGSVGElement.pixelUnitToMillimeterY 已廢棄

一個浮點數,表示視口 Y 軸上畫素單位的大小。

SVGSVGElement.screenPixelToMillimeterX 已廢棄

DOM Level 2 中的使用者介面(UI)事件指示了給定 UI 事件發生的螢幕位置。當瀏覽器實際知道“螢幕單位”的物理大小時,此浮點屬性將表達該資訊;否則,使用者代理將提供一個合適的預設值(例如 .28mm)。

SVGSVGElement.screenPixelToMillimeterY 已廢棄

視口 Y 軸上螢幕畫素的相應大小。

SVGSVGElement.useCurrentView 已廢棄 非標準

當前最內層 SVG 文件片段的初始檢視(即放大和平移之前)可以是“標準”檢視(即基於 <svg> 元素上的屬性,例如 viewBox),也可以是“自定義”檢視(即指向特定 <view> 或其他元素的超連結)。如果初始檢視是“標準”檢視,則此屬性為 false。如果初始檢視是“自定義”檢視,則此屬性為 true

SVGSVGElement.currentView 已廢棄 非標準

一個 SVGViewSpec,定義了當前最內層 SVG 文件片段的初始檢視(即放大和平移之前)。其含義取決於具體情況:如果初始檢視是“標準”檢視,則

  • currentView 中的 viewBoxpreserveAspectRatiozoomAndPan 值將與 SVGSVGElement 上直接對應的 DOM 屬性值匹配。
  • currentView 中的 transform 值將為 null

如果初始檢視是連結到 <view> 元素,則

  • currentView 中的 viewBoxpreserveAspectRatiozoomAndPan 值將與給定 <view> 元素的相應屬性值對應。
  • currentView 中的 transform 值將為 null

如果初始檢視是連結到其他元素(即非 <view>),則

  • currentView 中的 viewBoxpreserveAspectRatiozoomAndPan 值將與最近的祖先 <svg> 元素上直接對應的 DOM 屬性值匹配。
  • currentView 中的 transform 值將為 null

如果初始檢視是使用 SVG 檢視規範片段識別符號(即 #svgView(…))連結到 SVG 文件片段,則

  • currentView 中的 viewBoxpreserveAspectRatiozoomAndPantransform 值將與 SVG 檢視規範片段識別符號中的值對應。
SVGSVGElement.currentScale

在最外層 <svg> 元素上,此浮點屬性指示相對於初始檢視的當前縮放因子,以考慮使用者的放大和平移操作。DOM 屬性 currentScalecurrentTranslate 等價於 2×3 矩陣 [a b c d e f] = [currentScale 0 0 currentScale currentTranslate.x currentTranslate.y]。如果啟用了“放大”(即 zoomAndPan="magnify"),則效果就像在 SVG 文件片段的最外層(即最外層 <svg> 元素之外)放置了一個額外的變換。

SVGSVGElement.currentTranslate 只讀

一個 DOMPointReadOnly 物件,表示考慮使用者對最外層 <svg> 元素“放大”所對應的平移因子。對於非最外層 <svg> 元素,其行為未定義。

例項方法

此介面還繼承了其父介面 SVGGraphicsElement 的方法。

SVGSVGElement.suspendRedraw() 已廢棄

接受一個超時值,表示在以下情況發生之前不應進行重繪:

已呼叫相應的 unsuspendRedraw()、已呼叫 unsuspendRedrawAll(),或其計時器已超時。

在不支援互動性的環境(例如,列印媒體)中,不應暫停重繪。對 suspendRedraw()unsuspendRedraw() 的呼叫應該(但非必須)成對出現。

為了在發生一組 SVG DOM 更改時暫停重繪操作,請在 SVG DOM 更改之前呼叫類似以下的方法:

js
const suspendHandleID = suspendRedraw(maxWaitMilliseconds);

並在更改之後呼叫類似以下的方法:

js
unsuspendRedraw(suspendHandleID);

請注意,可以同時使用多個 suspendRedraw() 呼叫,並且每個此類方法呼叫都獨立於其他 suspendRedraw() 方法呼叫。

SVGSVGElement.unsuspendRedraw() 已廢棄

透過提供先前 suspendRedraw() 呼叫返回的唯一暫停控制代碼 ID,取消指定的 suspendRedraw()

SVGSVGElement.unsuspendRedrawAll() 已廢棄

取消所有當前活動的 suspendRedraw() 方法呼叫。此方法在 SVG DOM 呼叫集結束時最有用,以確保所有待處理的 suspendRedraw() 方法呼叫已被取消。

SVGSVGElement.forceRedraw() 已廢棄

在支援互動性的渲染環境中,強制使用者代理立即重繪視口中所有需要更新的區域。

SVGSVGElement.pauseAnimations()

暫停(即停止)此 <svg> 元素對應的 SVG 文件片段中定義的所有當前執行的動畫,導致此文件片段對應的動畫時鐘停止,直到其取消暫停。

SVGSVGElement.unpauseAnimations()

恢復(即取消暫停)SVG 文件片段中定義的當前執行動畫,導致動畫時鐘從暫停時的時間繼續。

SVGSVGElement.animationsPaused()

如果此 SVG 文件片段處於暫停狀態,則返回 true

SVGSVGElement.getCurrentTime()

返回相對於當前 SVG 文件片段開始時間的當前時間(以秒為單位)。如果在文件時間線開始之前呼叫 getCurrentTime()(例如,透過在文件的 SVGLoad 事件分派之前在 <script> 元素中執行的指令碼),則返回 0

SVGSVGElement.setCurrentTime()

調整此 SVG 文件片段的時鐘,建立一個新的當前時間。如果在文件時間線開始之前呼叫 setCurrentTime()(例如,透過在文件的 SVGLoad 事件分派之前在 <script> 元素中執行的指令碼),則方法最後一次呼叫中的秒值給出文件時間線開始後將跳轉到的時間。

SVGSVGElement.getIntersectionList()

返回與提供的矩形相交的圖形元素 NodeList。只有當相同的圖形元素可以成為 pointer-events 處理中定義的指標事件的目標時,才認為每個候選圖形元素匹配。

SVGSVGElement.getEnclosureList()

返回其渲染內容完全包含在提供的矩形內的圖形元素的 NodeList。只有當相同的圖形元素可以成為 pointer-events 處理中定義的指標事件的目標時,才認為每個候選圖形元素匹配。

SVGSVGElement.checkIntersection()

如果給定元素的渲染內容與提供的矩形相交,則返回 true。只有當相同的圖形元素可以成為 pointer-events 處理中定義的指標事件的目標時,才認為每個候選圖形元素匹配。

SVGSVGElement.checkEnclosure()

如果給定元素的渲染內容完全包含在提供的矩形內,則返回 true。只有當相同的圖形元素可以成為 pointer-events 處理中定義的指標事件的目標時,才認為每個候選圖形元素匹配。

SVGSVGElement.deselectAll()

取消選擇任何選定的物件,包括任何文字字串和輸入框的選擇。

SVGSVGElement.createSVGNumber()

在任何文件樹之外建立一個 SVGNumber 物件。該物件初始化為 0

SVGSVGElement.createSVGLength()

在任何文件樹之外建立一個 SVGLength 物件。該物件初始化為 0 使用者單位。

SVGSVGElement.createSVGAngle()

在任何文件樹之外建立一個 SVGAngle 物件。該物件初始化為 0 度(無單位)的值。

SVGSVGElement.createSVGPoint()

在任何文件樹之外建立一個 DOMPoint 物件。該物件初始化為使用者座標系中的點 (0,0)

SVGSVGElement.createSVGMatrix()

在任何文件樹之外建立一個 DOMMatrix 物件。該物件初始化為單位矩陣。

SVGSVGElement.createSVGRect()

在任何文件樹之外建立一個 SVGRect 物件。該物件初始化為所有值都設定為 0 使用者單位。

SVGSVGElement.createSVGTransform()

在任何文件樹之外建立一個 SVGTransform 物件。該物件初始化為單位矩陣變換 (SVG_TRANSFORM_MATRIX)。

SVGSVGElement.createSVGTransformFromMatrix()

在任何文件樹之外建立一個 SVGTransform 物件。該物件初始化為給定的矩陣變換(即 SVG_TRANSFORM_MATRIX)。引數矩陣的值被複制,矩陣引數不會被用作 SVGTransform::matrix

SVGSVGElement.getElementById()

在此 SVG 文件片段(即搜尋僅限於文件樹的子集)中搜索 idelementId 給定的元素。如果找到元素,則返回該元素。如果不存在此類元素,則返回 null。如果多個元素具有此 id,則行為未定義。

事件處理器

以下 Window onXYZ 事件處理程式屬性也作為別名可用,目標是 window 物件。但是,建議直接在 window 物件而不是 SVGSVGElement 上監聽它們。

注意:SVGSVGElement 上使用 addEventListener() 對下面列出的 onXYZ 事件處理程式不起作用。請改為在 window 物件上監聽事件。

SVGSVGElement.onafterprint

在相關文件開始列印或列印預覽關閉後觸發。

SVGSVGElement.onbeforeprint

在相關文件即將列印或預覽列印時觸發。

SVGSVGElement.onbeforeunload

當視窗、文件及其資源即將被解除安裝時觸發。

SVGSVGElement.ongamepadconnected

當瀏覽器檢測到遊戲手柄已連線或首次使用遊戲手柄的按鈕/軸時觸發。

SVGSVGElement.ongamepaddisconnected

當瀏覽器檢測到遊戲手柄已斷開連線時觸發。

SVGSVGElement.onhashchange

當 URL 的片段識別符號(以 # 符號開頭並跟隨的部分)發生變化時觸發。

SVGSVGElement.onlanguagechange

在使用者首選語言更改時觸發。

SVGSVGElement.onmessage

當視窗收到訊息時觸發,例如來自另一個瀏覽上下文的 Window.postMessage() 呼叫。

SVGSVGElement.onmessageerror

當視窗收到無法反序列化的訊息時觸發。

SVGSVGElement.onoffline

當瀏覽器失去網路訪問許可權並且 Navigator.onLine 的值切換為 false 時觸發。

SVGSVGElement.ononline

當瀏覽器重新獲得網路訪問許可權並且 Navigator.onLine 的值切換為 true 時觸發。

SVGSVGElement.onpagehide

當瀏覽器在顯示會話歷史記錄中的不同頁面時隱藏當前頁面時觸發。

SVGSVGElement.onpageshow

當瀏覽器由於導航而顯示視窗文件時觸發。

SVGSVGElement.onpopstate

當用戶瀏覽會話歷史記錄時,活動歷史記錄條目更改時觸發。

SVGSVGElement.onrejectionhandled

每當 JavaScript Promise 被拒絕且該拒絕已處理時觸發。

SVGSVGElement.onstorage

當在另一個文件的上下文中修改儲存區域 (localStorage) 時觸發。

SVGSVGElement.onunhandledrejection

每當 Promise 被拒絕但該拒絕未處理時觸發。

SVGSVGElement.onunload

當文件正在解除安裝時觸發。

規範

規範
Scalable Vector Graphics (SVG) 2
# 介面 SVGSVGElement

瀏覽器相容性

另見