jQuery選擇通過XLink的

$('a[xlink\\:href=#coastline]').attr('class','grey'); 
$('a[xlink\\:href=#onshore]').attr('class','blue-light');

這是我現在必須選擇具有#coastline的XLink的每個項目，並把它灰色和轉向#onshore到blue-lightjQuery選擇通過XLink的

我將如何能夠改變上述選擇任何a[xlink\\:href]並給它一個類？

我已經試過$('a[xlink:href]').attr('class', 'yellow');，但這並沒有給他們的一類yellow

來源

2014-09-24 ngplayground

測試你是什麼意思我的XLink？它是任何插件？ – 2014-09-24 08:53:10

@jogesh_pi我編輯了原帖子 – ngplayground 2014-09-24 08:57:21

你在哪裏擁有它？ SVG還是XML？ – 2014-09-24 08:58:39

xlink可以在XML標籤中找到，是棘手爲選擇他們在另一個名字空間。

您可以通過所有的元素儘量循環和修改DOM元素的className

var $elements = $('a[xlink\\:href]'); 
$elements.each(function(index, element) { 
    element.className = 'my-new-class'; 
});

UPDATE：當前選擇應該返回null作爲它的命名空間的問題。我們可以用特殊的選擇a[*|xlink]Stack Overflow post reference

我們知道這是SVG解決這個命名空間，所以要改變SVG對象類，我們必須使用attr功能上它們。如果你只是想選擇SVG元素中的所有鏈接我會像這樣的東西有：

var $svg = $('svg'); 
var $elements = $('a[*|xlink]', $svg); // Select all a xlink attributes inside svg object 


$elements.each(function(index, element) { 
    $(element).attr('class', 'my-new-class'); // force class attribute 
});

的jsfiddle：http://jsfiddle.net/nbfdydzd/

來源

2014-09-24 09:00:26 lovethebomb

'未捕獲的錯誤：語法錯誤，無法識別的表達式：a [xlink：href]' – ngplayground 2014-09-24 09:01:29

我想你必須在上面輸入原始文章時斜槓。你可能想檢查這篇關於XML/SVG命名空間和選擇器的文章 http://stackoverflow.com/questions/23034283/is-it-possible-to-use-htmls-queryselector-to-select-by-xlink -attribute功能於一個 – lovethebomb 2014-09-24 09:02:28

也許這是你想要的Demo

$('a').each(function(i){ 
    if($(this).attr('href') == "#coastline") $(this).addClass('gray'); 
    if($(this).attr('href') == "#onshore") $(this).addClass('green'); 
    if($(this).attr('href') == "") $(this).addClass('yello'); 
});

來源

2014-09-24 08:58:40

您需要特殊字符轉義

$('a[xlink\\:href]').attr('class', 'yellow');

來源

2014-09-24 09:03:07 Icepick

從你的評論，我想你有好幾條，像

<a xlink:href="http://www.google.com" target="_blank"> 
    <text x="0" y="15" fill="red">Link text here</text> 
</a>

因此，要改變它的顏色，你可以嘗試改變它的fill屬性像

$('a[xlink\\:href=#coastline]').attr('fill','#ff00ff');

來源

2014-09-24 09:03:20

[*|href]將同時匹配HTML href和SVG xlink:href，然後用:not([href])排除HTML href。

//document.querySelectorAll('[*|href]:not([href])'); 
$('[*|href]:not([href])');

鉻

來源

2016-10-10 08:00:46 cuixiping

jQuery選擇通過XLink的

回答

相關問題