更改div中的所有Anchor href链接

Question

我正在尝试使用jQuery更改所有html锚href链接，但无法正常工作。 当我单击按钮时，它选择第一个链接并在所有位置替换。

 var link = $('#content a[href]'); $("button").click(function() { var lin = $("#content a").attr('href'); var rep = "http://example.com/?redirect="; $("#content a[href]").attr("href", rep + "" + $("#content a").attr('href')); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="content"> <a href="http://google.com">Google</a> <a href="http://fb.com">Facebook</a> </div> <button>Click</button> <div class="p"></div> 

Answer 1

您正在使用$("#content a").attr('href')替换href ...它将找到第一个匹配项并替换为所有

您必须使用each()查找所有链接，然后使用$(this).attr('href')进行区分

堆栈片段

 $(document).ready(function() { $("button").click(function() { var rep = "http://example.com/?redirect="; $("#content a[href]").each(function() { $(this).attr("href", rep + "" + $(this).attr('href')); }) }); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="content"> <a href="http://google.com">Google</a> <a href="http://fb.com">Facebook</a> </div> <button>Click</button> <div class="p"></div>