How to get value of tag in 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.

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

Thanks in advance

回答1:

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

Then, you might want to use .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,
.push() your values in an array,
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.

So try .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:

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

来源：https://stackoverflow.com/questions/51518727/how-to-get-value-of-a-tag-in-javascript

标签

javascript

html

anchor

How to get value of <a> tag in JavaScript

问题

回答1:

回答2:

回答3: