如何使用jQuery选择在<text>中具有特定文本的特定<g>作为其子项？</text> </g>

Question

我有html如下

<svg>
    <g>
        <rect></rect>
        <text> abc </text>
    </g>

    <g>
        <rect></rect>
        <text> def </text>
    </g>
</svg>

我想选择具有子文本标签的g标签作为其值“abc”，并且应该向其附加一些其他文本标签，以便最终输出为

    <svg>
    <g>
        <rect></rect>
        <text> abc </text>
        <text> extra added abc </text>
    </g>

    <g>
        <rect></rect>
        <text> def </text>
    </g>
</svg>

Answer 1

定位g has() text标记的contains()标记，abc字符串g，然后将该元素附加到该$('g:has(text:contains("abc"))').append($('<text />', {text : ' extra added abc '})); 像这样的标签。

{{1}}

Answer 2

试试这个：

$(function(){
  $('g text:contains(abc)').closest('g').append('<text> extra added abc </text>');
});

Answer 3

$(function(){
  $('g text:contains(abc)').after('<text> extra added abc </text>');
});