[解決済み] SVGドキュメントはカスタムdata-属性をサポートしていますか?
2023-03-16 15:14:29
質問
HTML5 では、要素に任意のメタデータを XML 属性に格納することができ、その名前は
data-
のような
<p data-myid="123456">
. これもSVGの仕様の一部なのでしょうか?
実際には、このテクニックは多くの場所で SVG ドキュメントに対してうまく機能します。 しかし、私はこれが公式の SVG 仕様の一部であるかどうかを知りたいのです。なぜなら、このフォーマットはまだ十分に新しく、特にモバイルではブラウザ間で多くの非互換性があるからです。 ですから、コードをコミットする前に、将来のブラウザがこれをサポートすることに集中することを期待できるかどうかを知りたいと思います。
私は このメッセージ は、ワーキンググループのメーリングリストによると、サポートされることを期待しているとのことです。 これは公式になったのでしょうか?
どのように解決するのですか?
他の回答は技術的には正しいのですが、SVGが以下のような代替メカニズムを提供しているという事実が抜け落ちています。
data-*
. SVG
では、任意の属性とタグ
を含めることができます。既存のものと衝突しない限り(言い換えれば、名前空間を使用する必要があります)。
この(同等の)メカニズムを使用するには
-
使用
mydata:id
の代わりにdata-myid
のような、このような<p mydata:id="123456">
-
のように、SVGの開始タグで名前空間を定義していることを確認してください。
<svg xmlns:mydata="http://www.myexample.com/whatever">
EDITです。
SVG2
は、現在W3C Candidate Recommendation (2018年10月04日) で、今後
をサポートします。
data-
を直接
(をサポートします(名前空間なし、HTMLと同じ)。しかし、このサポートが広まるにはまだ時間がかかりそうです。CVREBERT に感謝します。
が指摘してくれた
.
関連
-
[解決済み] d3.jsでノードのダブルクリックイベントを作成するにはどうすればよいですか?
-
[解決済み] svg要素の色を変更するには?
-
[解決済み] Do I use <img>, <object>, or <embed> for SVG files?
-
[解決済み] HTML5 CanvasとSVGとdivの比較
-
[解決済み] ImageMagickでSVGをPNGに変換する方法は?
-
[解決済み] SVGの塗りつぶし色の透明度/アルファ値?
-
[解決済み] CSSを使用してSVG画像の色を変更する方法(jQuery SVG image replacement)とは?
-
[解決済み] CSSでのインラインSVG
-
[解決済み】css3を使ったSVGドロップシャドウ
-
[解決済み】PNG vs. GIF vs. JPEG vs. SVGの異なるユースケースとは?[クローズド]
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] SVGで中空円を描画する
-
[解決済み] d3.jsでノードのダブルクリックイベントを作成するにはどうすればよいですか?
-
[解決済み] getBBox() SVGRectはどのように計算するのですか?
-
[解決済み] SafariでSvg画像要素が表示されない
-
[解決済み] SVG における text 要素の垂直アライメント
-
[解決済み] SVGユースタグとReactJS
-
[解決済み] SVGのストローク幅を固定化
-
[解決済み] enable-background属性は、具体的に何をするのですか?
-
[解決済み] テキストの横にアイコンを表示する最も堅牢な方法 [終了しました]。
-
[解決済み] svgコードを.svg画像として保存するにはどうすればよいですか?[クローズド]