The SVG
script
element allows to add scripts to an SVG document.
注意:
While SVG's
script
element is equivalent to the HTML
<script>
element, it has some discrepancies, like it uses the
href
attribute instead of
src
and it doesn't support ECMAScript modules so far (See browser compatibility below for details)
<svg viewBox="0 0 10 10" xmlns="http://www.w3.org/2000/svg">
<script>
// <![CDATA[
window.addEventListener('DOMContentLoaded', () => {
function getColor () {
const R = Math.round(Math.random() * 255).toString(16).padStart(2,'0')
const G = Math.round(Math.random() * 255).toString(16).padStart(2,'0')
const B = Math.round(Math.random() * 255).toString(16).padStart(2,'0')
return `#${R}${G}${B}`
}
document.querySelector('circle').addEventListener('click', (e) => {
e.target.style.fill = getColor()
})
})
// ]]>
</script>
<circle cx="5" cy="5" r="4" />
</svg>
crossorigin
This attribute defines
CORS settings
as define for the HTML
<script>
元素。
Value type
:
<string>
;
默认值
:
?
;
Animatable
:
yes
href
URL to the script to load. Value type : <URL> ; 默认值 : none ; Animatable : no
type
This attribute defines type of the script language to use.
Value type
:
<string>
;
默认值
:
application/ecmascript
;
Animatable
:
no
xlink:href
URL to the script to load. Value type : <URL> ; 默认值 : none ; Animatable : no
Most notably:
id
class
,
style
| 类别 | None |
|---|---|
| 准许内容 | Any elements or character data |
| 规范 |
|---|
|
Scalable Vector Graphics (SVG) 1.1 (Second Edition)
(SVG)
# ScriptElement |
BCD tables only load in the browser
<feBlend>
<feColorMatrix>
<feComponentTransfer>
<feComposite>
<feConvolveMatrix>
<feDiffuseLighting>
<feDisplacementMap>
<feDistantLight>
<feFlood>
<feFuncA>
<feFuncB>
<feFuncG>
<feFuncR>
<feGaussianBlur>
<feImage>
<feMerge>
<feMergeNode>
<feMorphology>
<feOffset>
<fePointLight>
<feSpecularLighting>
<feSpotLight>
<feTile>
<feTurbulence>
<filter>
<font>
<font-face>
<font-face-format>
<font-face-name>
<font-face-src>
<font-face-uri>
<foreignObject>
最后修改: , 由 MDN 贡献者