如何根据href属性获取元素

任务是通过其href属性选择<a>元素。下面讨论了一些技术。这里我们将使用JQuery来解决这个问题。

方法：使用JQuery选择器 $(‘a[href=link_to_site]’)

示例1： 这个示例使用上面讨论的方法。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"> 
</script> 
<h1 id="h1" style="color:green;"> 
    GeeksforGeeks 
</h1> 
<p id="GFG_UP" style="font-size: 15px; font-weight: bold;"> 
</p> 
<a href="https://www.geeksforgeeks.org">GeeksforGeeks 
</a> 
<br> 
<br> 
<button onclick="gfg_Run()"> 
    Click here 
</button> 
<p id="GFG_DOWN" style="font-size: 23px; 
    font-weight: bold; color: green; "> 
</p> 
<script> 
    var el_up = document.getElementById("GFG_UP"); 
    var el_down = document.getElementById("GFG_DOWN"); 
    el_up.innerHTML = 
    "Click on the button to select the element by HREF attribute."; 
    function gfg_Run() { 
        el_down.innerHTML = 
            $('a[href="https://www.geeksforgeeks.org"]').text(); 
    }         
</script>

输出:

方法2：使用jQuery选择器$(‘a[href*=part_of_link]’)

如果属性的任何部分与值匹配，它将选择该元素。

示例2： 这个示例使用上面讨论的方法。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"> 
</script> 
<h1 id="h1" style="color:green;"> 
    GeeksforGeeks 
</h1> 
<p id="GFG_UP" style="font-size: 15px; font-weight: bold;"> 
</p> 
<a href="https://www.geeksforgeeks.org"> GeeksforGeeks 
</a> 
<br> 
<br> 
<button onclick="gfg_Run()"> 
    Click here 
</button> 
<p id="GFG_DOWN" style="font-size: 23px; 
        font-weight: bold; color: green; "> 
</p> 
<script> 
    var el_up = document.getElementById("GFG_UP"); 
    var el_down = document.getElementById("GFG_DOWN"); 
    el_up.innerHTML = 
    "Click on the button to select the element by HREF attribute."; 
    function gfg_Run() { 
        el_down.innerHTML = $('a[href*="geeks.org"]').text(); 
    }         
</script>

输出：