在运行时设置href属性

2020/10/16 15:21 · javascript ·  · 0评论

使用jQuery在运行时设置标签href属性的最佳方法是什么<a>

另外,如何使用jQueryhref获取<a>标签属性的值

要获取或设置HTML元素的属性,可以element.attr()在jQuery中使用该函数。

要获取href属性,请使用以下代码:

var a_href = $('selector').attr('href');

要设置href属性,请使用以下代码:

$('selector').attr('href','http://example.com');

在这两种情况下,请使用适当的选择器。如果已为anchor元素设置了类,请使用'.class-name';如果已为anchor元素设置了id,请使用'#element-id'

在jQuery 1.6+中,最好使用:

$(selector).prop('href',"http://www...")设定值,

$(selector).prop('href')获取价值

简而言之,.prop获取和设置DOM对象的,并.attr获取和设置HTML的.prop在某些情况下,这会使速度更快,甚至可能更可靠。

用设置href属性

$(selector).attr('href', 'url_goes_here');

并使用阅读

$(selector).attr('href');

其中,“选择器”是<a>元素的任何有效jQuery选择器(“ .myClass”或“ #myId”用于命名最简单的选择器)。

希望这可以帮助 !

三种解决方案的小型性能测试比较:

  1. $(".link").prop('href',"https://example.com")
  2. $(".link").attr('href',"https://example.com")
  3. document.querySelector(".link").href="https://example.com";

在此处输入图片说明

在这里,您可以自己执行测试https://jsperf.com/a-href-js-change


我们可以通过以下方式读取href值

  1. let href = $(selector).prop('href');
  2. let href = $(selector).attr('href');
  3. let href = document.querySelector(".link").href;

在此处输入图片说明

在这里,您可以自己执行测试https://jsperf.com/a-href-js-read

<style>
a:hover {
    cursor:pointer;
}
</style>

<script type="text/javascript" src="lib/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $(".link").click(function(){
        var href = $(this).attr("href").split("#");
        $(".results").text(href[1]);
    })
})
</script>



<a class="link" href="#one">one</a><br />
<a class="link" href="#two">two</a><br />
<a class="link" href="#three">three</a><br />
<a class="link" href="#four">four</a><br />
<a class="link" href="#five">five</a>


<br /><br />
<div class="results"></div>
本文地址:http://javascript.askforanswer.com/zaiyunxingshishezhihrefshuxing.html
文章标签: ,   ,  
版权声明:本文为原创文章,版权归 javascript 所有,欢迎分享本文,转载请保留出处!

文件下载

老薛主机终身7折优惠码boke112

上一篇:
下一篇:

评论已关闭!