使用jquery查找包含特定ID的元素并突出显示它们

Question

我是一个jquery / javascript新手，所以不太确定如何解决此问题。我想修改一个已经在浏览器中提供给我的网站。

左侧有一些框，然后有箭头从这些框延伸到右侧的其他框。我正在尝试使用单击事件侦听器单击左侧的框，使其突出显示，然后突出显示与该框关联的箭头。

这里是我到目前为止的内容，它可以突出显示左侧的方框。我还想做的是突出显示包含此ID的所有箭头，因为可能有多个箭头起源于一个框。

javascript: document.designMode = "on"; document.designMode = "on"; 

$("div[example]").on('click', function(e) { 
    var t = $(this).attr('id'); 
    e.preventDefault();
    $(this).css('background-color', 'red');
    console.log(t);

});     

单击框时，我可以打印出正确的元素ID（例如ID_of_lefthandbox）。因此，使用该ID，我想在包含该ID的网页上找到箭头。这是路径的样子：

<path to-id="12345" approved="true" id="43210" from-id="ID_of_lefthandbox" stroke-width="2" fill="" d="M5,193 53,261" stroke="DarkGreen" stroke-linecap="round" marker-end="url(#markGreenArrow)"></path>

Answer 1

假设属性from-id包含您要查找的左手箱的id，以下工作：

 $("div[example]").on('click', function(e) { 
    var t = $(this).attr('id'); 
    e.preventDefault();
    $(this).css('background-color', 'red');
    $("path[from-id='" + t + "']").css("background-color", "red");
    console.log(t);
 });