如何在JavaScript中获取标签的值

I have this code:

我有这个代码:

<html>
<BUTTON ONCLICK="stups()">VALUE FINDER </BUTTON>
<a value="this is a value" href="value"><img src="b5.jpg"> values rule!!</a>
<p id="demo"></p>
<script>
var a = document.getElementsByTagName("a").value
function stups(){

document.getElementById("demo").innerHTML=a

}
</script>


</html>

The javascript is simply meant to get the value of th (link) when the button is clicked I don't even know what is supposed to be the value whether it is th href attribute, the value attribute ,the value of the img attribute or the text in between the two <a>and </a>,well I've tried EVERYTHING i could think of and it never gives me any value it keeps giving me the word undefined.Please help.

javascript只是为了获得点击按钮时th(链接)的值我甚至不知道它是什么值,无论是href属性,值属性,img属性的值还是两个和之间的文字,我已经尝试了一切,我能想到它,它从来没有给我任何价值,它一直给我这个词undefined。请帮忙。

NB:I need that to be in between the <a></a> because it is a link

注意:我需要在之间,因为它是一个链接

Thanks in advance

提前致谢

3 个解决方案

#1

First of all, take care of what you want to do, because .getElementsByTagName("a") will return you a collection of elements.

首先,要注意你想要做什么,因为.getElementsByTagName(“a”)将返回一组元素。

Then, you might want to use .getAttribute("value"):

然后,您可能想要使用.getAttribute(“value”):

var a = document.getElementsByTagName("a");

function stups(){
  document.getElementById("demo").innerHTML = a[0].getAttribute("value");
}

<BUTTON ONCLICK="stups()">VALUE FINDER </BUTTON>
<a value="this is a value" href="value"><img src="b5.jpg"> values rule!!</a>
<p id="demo"></p>

⋅ ⋅ ⋅

⋅·⋅

If you want to manage multiple a elements, you could do the following:

如果要管理多个元素,可以执行以下操作:

Use a .querySelectorAll("a"), to be able to use a forEach loop directly,

使用.querySelectorAll(“a”),可以直接使用forEach循环,

.push() your values in an array,

.push()数组中的值,

Do what you want with your array.

用你的阵列做你想做的事。

var as = document.querySelectorAll("a");

function stups(){
  var values = [];
  as.forEach(function(a, index){
    values.push(a.getAttribute("value") || '--- no value ---');
    // OR: values.push(as[index].getAttribute("value"));
  })
  document.getElementById("demo").innerHTML = values.join('<br>');
}

<BUTTON ONCLICK="stups()">VALUE FINDER </BUTTON>
<a value="this is a value" href="value"><img src="b5.jpg"> values rule!!</a>
<a value="this is another value" href="value"><img src="b5.jpg"> values rule!!</a>
<a href="value"><img src="b5.jpg">No value here</a>
<a value="this is another value, again" href="value"><img src="b5.jpg"> values rule!!</a>
<p id="demo"></p>

Hope it helps.

希望能帮助到你。

#2

You need to define which attribute you need from the a tag.

您需要从a标签定义所需的属性。

So try .getAttribute('value')

所以试试.getAttribute('value')

<html>
<button onclick="stups()">VALUE FINDER </button>
<a value="this is a value" href="value"><img src="b5.jpg"> values rule!!</a>
<p id="demo"></p>
<script>

function stups(){
   var a = document.getElementsByTagName('a')[0].getAttribute('value');
   document.getElementById("demo").innerHTML=a

}
</script>
</html>

#3

In these situations, MDN is your friend. You also shouldn't be copy-pasting code you don't understand. The src of the img points to whatever image is being displayed. The href of the a tag is the actual link. The text inside the a tag is what shows up. You should not be setting the value attribute of the a tag as it is non-standard and not needed. document.getElementsByTagName("a") returns an array of every a tag in the document. You need to specify the first link by running document.getElementsByTagName("a")[0]. You can get the link just by using .href. In the end, the stups function should look something like this:

在这些情况下,MDN是您的朋友。您也不应该复制粘贴您不理解的代码。 img的src指向正在显示的任何图像。 a标签的href是实际链接。标签内的文字显示出来。您不应该设置a标签的value属性,因为它是非标准的而不是必需的。 document.getElementsByTagName(“a”)返回文档中每个标记的数组。您需要通过运行document.getElementsByTagName(“a”)[0]来指定第一个链接。您只需使用.href即可获得链接。最后,stups函数看起来应该是这样的:

function stups(){
    var a = document.getElementsByTagName("a")[0].href;
    document.getElementById("demo").innerHTML = a;
}

#1