Question

我的链接看起来像这样：

<a class="link" href="https://www.google.com/?q=">Hello world</a>

是否可以将其呈现为Hello World？

链接应指向https://www.google.com/?q=Hello world，而不在href中指定此链接。

我认为javascript可能是最好的方法吗？

任何帮助都会很好！

Answer 1

假设您的href始终采用https://www.google.com/?q=格式，您可以执行以下操作：

var eles = document.getElementsByTagName('a');
for(var i = 0, len = eles.length; i < len; i++) {
    //get the inner html of anchor tag
    //var text = eles[i].innerHTML;
    //better use textContent
    var text = eles[i].textContent;
    //append anchor tag inner html to href
    eles[i].href += text;
}

Answer 2

你能试试吗，

<a class="link" href="https://www.google.com/?q=" onclick='window.location.href = this.href+encodeURI(this.textContent); return false; '>Hello world</a>

添加了onclick个事件处理程序并获取了代码的href和textContent并将它们组合在一起。然后它会给出预期的结果。

已更新：如果您的网页中有很多链接，那么您可以创建javascript函数并在必要时调用它。

<强>使用Javascript：

 function Search(d){
     window.location.href = d.href+encodeURI(d.textContent); 
    return false; 
 }

HTML：

 <a class="link" href="https://www.google.com/?q=" onclick='Search(this);'>Hello world</a>

即使您想要集成jquery，这个过程也可能变得更简单。

Answer 3

text = $(".link").html();
link = $(".link").attr('href');
$(".link").attr('href',link+text);

Answer 4

这可以帮到你

的Javascript

function changeHref () {
        var anchor = document.getElementsByTagName('a')[0];
        anchor.href += anchor.textContent;
}

HTML

<a class="link" onclick="changeHref()" href="https://www.google.com/?q=">Hello world</a>

Answer 5

DEMO：http://jsbin.com/rudobe/edit?html,js,output

HTML：

<a class="link" href="https://www.google.com/?q=">Hello world</a>

JS：

var anchor = document.getElementsByClassName('link')[0];
var href = anchor.getAttribute('href');
var text = anchor.textContent;
anchor.setAttribute('href', href + text); // The `+` operator concatenates here.

DOCS：

http://devdocs.io/dom/element.setattribute

http://devdocs.io/dom/element.getattribute

http://devdocs.io/dom/node.textcontent

http://devdocs.io/dom/document.getelementsbyclassname

Answer 6

也许是这样的：

$('.link').click(function(){
    $(this).attr('href', this.href + encodeURIComponent($(this).text()));
});

Fiddle

这将在提交链接之前更改href属性

Answer 7

您可以使用javascript的onclick事件：

<a class="link" href="#" onclick="navigateToLink(this)">Hello world</a>

在javascript中你就可以像这样处理它：

function navigateToLink(elt){
   console.log("https://www.google.com/?q="+elt.textContent );
   window.location.href="https://www.google.com/?q="+ elt.textContent;
}

Working Fiddle

Answer 8

很多答案，所以一个人不会受伤。据推测，您无法控制服务器，否则您只需修改那里的href并完成它。一个简单的方法是：

<a href="..." onclick="this.href+=this.textContent||this.innerText">...</a>

使用 textContent 或 innerText 意味着您可以在链接的内容中添加标记，并且它不会成为href的一部分。

使用＆＃34; google.com＆＃34;修改链接的更通用的解决方案在href中是：

function modifyLinks() {
  var link, links = document.links;
  var re = /google\.com/i;

  for (var i=0, iLen=links.length; i<iLen; i++) {
    link = links[i];

    if (re.test(link.href)) {
      link.href += link.textContent || link.innerText;
    }
  }
}

window.onload = modifyLinks;

测试可以更改为任何内容，也许您希望将其基于 className 或其他一些属性。如果要修改所有链接，只需删除测试。

Answer 9

试试这个。

$(document).ready(function(){
    $('.link').on('click', function(){
        var temp = $(this).attr('href');
        var html = $(this).html();
        $(this).attr('href',temp+html);
    });
});

使锚点成为href的一部分？

9 个答案: