通过使用Javascript按下按钮来更改链接

问题描述：

我正在尝试创建代码，以便当您按下按钮时，链接将会更改。下面是HTML代码：通过使用Javascript按下按钮来更改链接

<div id="body"> 
<div class="mainbody"> 
<p id="para"></p> 
<h1>Here is my next Javascript Example</h1><br /> 
<p id="link1"><a href="index.html" title="Portfolio main" target="_blank">Portfolio Main</a></p> 
<input type="button" value="Change Link" id="bttn2" onClick="changeLink();" />  
</div>

下面是Javascript代码：

// JavaScript Document 
function changeLink() 
    { 
    document.getElementById("link1").innerHTML="Paramore"; 
    document.getElementById("link1").href="http://www.paramore.com"; 
    document.getElementById("link1").target="_blank"; 
    }

我的问题是，当我按下按钮，链接变化，但出现的词“Paramore”实际上并不是一个链接。

您的目标p，而不是链接。把id放在链接上并立即关闭这个问题。 – 2013-03-06 00:39:10

答

[1] ID = “链接1” 应该在锚标记，而不是段落标记

[2]使用.setAttribute方法对JavaScript DOM对象

obj = document.getElementById("link1"); 
obj.setAttribute("href","http://www.paramore.com"); 
obj.setAttribute("target","_blank");

请缓存您的节点引用（而不是每次查询DOM）。 – 2013-03-06 00:44:02

答

该ID需要位于<a>元素上。不是<p>元素。试试这个：

<div id="body"> 
<div class="mainbody"> 
<p id="para"></p> 
<h1>Here is my next Javascript Example</h1><br /> 
<p ><a id="link1" href="index.html" title="Portfolio main" target="_blank">Portfolio Main</a></p> 
<input type="button" value="Change Link" id="bttn2" onClick="changeLink();" />  
</div>

同样，也就是在这里完成的：出现“Paramore的” http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_elmnt_innerhtml

答

链接的变化，但这个词是不实际的链接。

这是因为您已将静态文本Paramore替换为链接，因为通过设置段落的文本，您已清除链接。

如果将id="link1"属性从p元素移动到a元素，则会对其进行排序。

或者，这样做：

var anchor = document.getElementById("link1").getElementsByTagName('a')[0]; 
anchor.innerHTML="Paramore"; 
anchor.href="http://www.paramore.com"; 
anchor.target="_blank";

但我不得不说，改变在点击一个锚是非常狡猾的。

单独为你的最后一句话+1（虽然，显然，*休息*也是完全有效的！） – 2013-03-06 00:44:38

这就是答案，谢谢你们！ – 2013-03-06 00:45:22

答

的document.getElementById（ “链接1”），会得到款<p>元素，你想要什么锚<一个>元素。我建议你把id =“link1”的属性放在你的而不是？

通过使用Javascript按下按钮来更改链接

相关推荐