イベントコードの初期挙動を防ぐ
ドラッグ・アンド・ドロップのコードを書いていると、時々、ページのテキストをドラッグ中に誤って付随的に選択されてしまうことがあります。
もしくは自分のコードの中でバックスペースキーを使いたい場合、バックスペースキーを押下したときに前のページへ戻る、ブラウザの既定の振る舞いを上書きしたいと望むでしょう。ブラウザが前のページに戻るのを防ぎたいと望むでしょう。
このような場合、evt.preventDefault() メソッドを使うことが出来ます。
オブジェクトに eventListeners を使う
対話的な SVG を書くとき、addEventListener() と removeEventListener() メソッドはとても便利です。これらのメソッドの二番目のパラメータとして、handleEvent インタフェースを実装するオブジェクトを渡すことができます。
function myRect(x,y,w,h,message){
this.message=message
this.rect=document.createElementNS("https://www.w3.org/2000/svg","rect")
this.rect.setAttributeNS(null,"x",x)
this.rect.setAttributeNS(null,"y",y)
this.rect.setAttributeNS(null,"width",w)
this.rect.setAttributeNS(null,"height",h)
document.documentElement.appendChild(this.rect)
this.rect.addEventListener("click",this,false)
this.handleEvent= function(evt){
switch (evt.type){
case "click":
alert(this.message)
break;
}
}
}
文書間のスクリプティング - 埋め込み SVG の参照
HTML 内で SVG を使う場合、Adobe SVG Viewer 3.0 は自動的に SVG 文書を示す svgDocument<code> と呼ばれるウィンドウプロパティをインクルードします。これは Mozilla のネイティヴ実装には当てはまりません。従って Mozilla では <code>window.svgDocument は動きません。代わりに埋め込まれた SVG ドキュメントを参照するために var svgDoc=document.embeds["name_of_svg"].getSVGDocument(); を代替使用することができます。
また、document.getElementById("svg_elem_name").getSVGDocument() を使用して同じ結果を得ることもできます。
文書間のスクリプティング - JavaScript 関数の呼びだし
HTML ドキュメントに埋め込まれた SVG ファイルから HTML ファイルの中にある JavaScript 関数を呼び出すとき、その関数を参照するには parent.functionname() を使うべきです。Adobe SVG Viewer プラグインは functionname() の利用を許可していますが、このようなことを行うには適していません。
注意: SVG wiki によると Adobe の SVG バージョン 6 プレビュープラグインでは "parent" JavaScript 変数は壊れているとのことです。提案された次善策は parent の代わりに top を使うことです。
更なる情報といくつかの例を SVG wiki inter-document scripting page で見付けることが出来ます。
setProperty は3つのパラメタを持ちます
Mozilla では svgElement.style.setProperty("fill-opacity", "0.0") 関数は SYNTAX ERR という DOMException を投げます。この挙動は W3C によって DOM Level 2 Style 仕様の中で定められています。setProperty 関数は 3 つのパラメタを持つ関数として定義されています。上記は 'svgElement.style.setProperty("fill-opacity", "0.0", "")' で置き換えられます。こちらの方がより標準に一致しています。
