脱毛トレフの代替手段は何ですか？

Question

私はsvg specに少し読み込んでいます。 tref -element https://www.w3.org/TR/SVG/single-page.html#text-TRefElementについて読んでいます。あなたのほとんどはtrefが侮辱されることを知っているでしょう。それで私は今、同じことをどうやってするのだろうかと思いました。あまりにも厳しくすべきではありませんが、私は本当にその話題で何かを見つけることはできません。私はまた、trefを否定する背後にある理由について興味があります。しかし、それはちょうど「楽しい事実」であろう。だから短く：

• trefの代替手段は何ですか？
• なぜtrefは控除されましたか？

あなたはJavascriptを少しと似た何かができるSVG

<svg> 
    <defs> 
    <text id="ReferencedText"> 
     Referenced character data 
    </text> 
    </defs> 
    <text x="100" y="200" font-size="45" fill="red" > 
    <tref href="#ReferencedText"/> 
    </text> 
</svg> 

Answer 1

。

$("text[tref]").each(function(index, textElem) { 
 
    $text = $(textElem); 
 
    ref = $text.attr("tref"); 
 
    refText = $(ref).text(); 
 
    $text.text(refText); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<svg> 
 
    <defs> 
 
    <text id="ReferencedText">Referenced character data</text> 
 
    <text id="OtherText">What magic is this?</text> 
 
    </defs> 
 
    <text x="50" y="100" font-size="20" fill="red" tref="#ReferencedText"/> 
 
    <text x="50" y="150" font-size="25" fill="green" tref="#OtherText"/> 
 
</svg>

ピュアJSバージョン

var elems = document.querySelectorAll("text[tref]"); 
 
elems.forEach(function(element) { 
 
    tref = element.getAttribute("tref"); 
 
    refText = document.querySelector(tref).textContent; 
 
    element.textContent = refText; 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<svg> 
 
    <defs> 
 
    <text id="ReferencedText">Referenced character data</text> 
 
    <text id="OtherText">What magic is this?</text> 
 
    </defs> 
 
    <text x="50" y="100" font-size="20" fill="red" tref="#ReferencedText"/> 
 
    <text x="50" y="150" font-size="25" fill="green" tref="#OtherText"/> 
 
</svg>

Answer 2

私は同じような状況があったし、さらに読めば、私は次のことをテストし、それがTREFで使用されるように働いていました働く：

<svg> 
    <defs> 
     <text id="Text1">The text to be shown</text> 
    </defs> 


    <use xlink:href="#Text1" x="560" y="850" style="font-family: Arial;fill:#000000; font-size:28px;"> 
</svg>