使用javascript打印链接的名称_Javascript

使用javascript打印链接的名称

javascript

使用javascript打印链接的名称,javascript,Javascript,我是javascript新手。我想在单击链接时在网页上打印链接的名称我的尝试是： <!DOCTYPE html> <html> <body> <a href="#Foo" id="link1" onclick="myFunction()">Click me</a>; <BR> <a href="#Foo1" id="link2" onclick="myFunction1()">Click me1<

我是javascript新手。我想在单击链接时在网页上打印链接的名称

我的尝试是：

<!DOCTYPE html>
<html>
<body>

 <a href="#Foo" id="link1" onclick="myFunction()">Click me</a>;
 <BR>
 <a href="#Foo1" id="link2" onclick="myFunction1()">Click me1</a>
 <p id="demo"></p>
 <script>
 function myFunction() {
    var t = document.getElementById('#link1').href ;       document.getElementById("demo").innerHTML =t;
 }
 function myFunction1() {
    var t1 = document.getElementById('#link2').href
     document.getElementById("demo").innerHTML = t1;
 }
 </script>

 </body>
 </html>


;



函数myFunction（）{
var t=document.getElementById（'#link1'）.href；document.getElementById（“demo”）.innerHTML=t；
}
函数myFunction1（）{
var t1=document.getElementById（'#link2'）.href
document.getElementById（“demo”）.innerHTML=t1；
}

我想打印链接的名称，而不是hello和hello world。请帮帮我。

只要换个新的

document.getElementById("demo").innerHTML ="hello";

与

还应避免使用内联事件处理程序绑定事件。”

<body>
   <a href="#Foo" id="link1">Click me</a>;
   <BR>
   <a href="#Foo1" id="link2">Click me1</a>
   <p id="demo"></p>
   <script>
      $('a').on('click', function(e) {
           e.preventDefault; // prevents the default action
           var linkText = $(this).text();

           $('#demo').text(linkText); // jQuery way
           document.getElementById("demo").innerHTML = linkText; // Vanilla JS
      });
 </script>
</body>


;



$（'a'）。在（'click'，函数（e）上{
e、 preventDefault；//阻止默认操作
var linkText=$（this.text（）；
$（'#demo'）.text（linkText）；//jQuery方式
document.getElementById（“demo”）.innerHTML=linkText；//JS
});

另外，您最好将整个JS提取到一个单独的文件中，并在脚本标记中引用您使用的是文本，而不是href属性。如果这是故意的，那么我可以告诉你，你的代码是按照预期的方式工作的

document.getElementById("demo").innerHTML = document.getElementById('link1').innerHTML;

问题2 您正在将值存储在变量中，而不是使用该值。这是代码中更可能出现的问题。由于该值只使用了一次，因此我将直接使用该值，而不是存储它

document.getElementById("demo").innerHTML = document.getElementById('link1').href;

我还删除了单行函数不必要的jquery和变量存储

最后请注意，在函数末尾添加return false将阻止链接尝试重定向。

如果要绘制锚文本，请将代码更新为以下内容

function myFunction() {
    document.getElementById("demo").innerHTML = document.getElementById("link1").innerHTML;
 }

function myFunction1() {
    document.getElementById("demo").innerHTML = document.getElementById("link2").innerHTML;
 }

改进

function myFunction(element) {
    document.getElementById("demo").innerHTML = element.innerHTML;
}

您可以在函数调用中传递

此

，并且可以有1个函数

标记

<a href="#Foo" id="link1" onclick="myFunction(this)">Click me</a>;
 <BR>
 <a href="#Foo1" id="link2" onclick="myFunction(this)">Click me1</a>

参考-

您可以使用jquery，而不是创建多个函数

$（文档）.ready（函数（）{
$（'a'）。在（'click'，function（）上{
$（'#demo'）.html（$（this.html（））；
});
});

;


如果您已经在使用jQuery，那么最好使用jQuery事件进行单击，而不是使用内联方法调用，以使调用“不引人注目”（untrusive）（）。大概是这样的：
<a href="#Foo" id="link1">Click me</a>
<a href="#Foo1" id="link2">Click me1</a>
<p id="demo"></p>
$(document).ready(function(){
$('a').click(function(){
    $('#demo').text($(this).html());
});
});



$（文档）.ready（函数（）{
$（'a'）。单击（函数（）{
$（'#demo'）.text（$（this.html（））；
});
});
名称是什么意思？链接名称是什么意思？name属性或link的innerHTML是否使用jquery？你在这里似乎有一些jQuery。你认为这些链接的名字是什么？如果有帮助解决你的问题，请标记答案。problem@Sushanth：尝试了此操作，但没有打印任何内容。您需要阻止默认操作。。在演示中检查此功能是否正常工作。但当我保存这个并运行时就不会了。你能告诉我原因吗？我合并了建议的更改，但没有打印任何内容。我在上面的代码中进行了编辑，这是因为您在id字符串中留下了hashmark。我更新了我的答案，使其更具描述性。最后一行可能很重要，因为tooOP没有标记jQuery。除非澄清，否则我们不应该使用jQuery。当我点击链接时，链接名不会被打印出来。请帮忙。你想取哪个名字？您想要“单击我”文本吗？该文本显示在“运行代码片段”中，并选中使用该文本不会打印任何内容。我们可以建议他在初次使用jquery时使用jquerythis@BhavinSolanki-它对我有用。如果您正在签入plunker，那么我正在更新它，所以您可能在中间状态下引用了它。@user299662-它对我来说很好用。签入共享。另外，如果不是，那么在你的完整代码中肯定有其他地方的问题。我投了反对票。有人能解释一下原因吗？
<a href="#Foo" id="link1">Click me</a>
<a href="#Foo1" id="link2">Click me1</a>
<p id="demo"></p>
$(document).ready(function(){
$('a').click(function(){
    $('#demo').text($(this).html());
});
});