I have a line <meta property="product:price:amount" content="3.05"/>
in a large html file.
I need to store the value of content inside a variable, so that I may access it globally.
How can I do that?
-
Have have you tried so far?NewToJS– NewToJS2017-07-21 14:29:57 +00:00Commented Jul 21, 2017 at 14:29
-
Welcome to Stack Overflow! You seem to be asking for someone to write some code for you. Stack Overflow is a question and answer site, not a code-writing service. Please see here to learn how to write effective questions.Rodrigo Leite– Rodrigo Leite2017-07-21 14:30:43 +00:00Commented Jul 21, 2017 at 14:30
-
jQuery: How to get the value of an html attribute?Jeremy Thille– Jeremy Thille2017-07-21 14:31:00 +00:00Commented Jul 21, 2017 at 14:31
Add a comment
|
4 Answers
Just catch it with querySelector to get it's content attribute.
const content = document.querySelector('meta').content;
console.log(content);<meta property="product:price:amount" content="3.05"/>In case of multiple meta tags:
const elems = document.querySelectorAll('meta');
let content = Array.from(elems).find(v => v.content).content;
console.log(content);<meta property="product:price:amount"/>
<meta property="product:price:amount"/>
<meta property="product:price:amount" content="3.05"/>4 Comments
hansTheFranz
that would not be very specific considering you have multiple meta elements right?
kind user
@hansTheFranz That's a higher level of abstraction, which requires another solution. In this specific case, that's a complete needed solution.
kashish
What's the need for
let content = elem.content;. Why can't I just do console.log(elem)kind user
@kashish Then you will log whole
meta element. If you really want to log it - console.log(elem.content).To very specifically get the meta tag you are after (event if there are multiple meta tags):
var variable = document.querySelectorAll('meta[property="product:price:amount"]')[0].content;
If there is only one item then simply
document.getElementsByTagName("meta")[0].content
Comments
For a single meta tag:
var myGlobal = document.querySelector('meta[content]').getAttribute('content');
document.body.textContent = myGlobal;<meta property="product:price:amount" content="3.05"/>If you have a lot of tags:
var contentArray = [];
document.querySelectorAll('meta[content]').forEach(function(meta){
contentArray.push(meta.getAttribute('content'));
});
document.body.textContent = contentArray.join(' - ');<meta property="product:price:amount" content="3.05"/>
<meta property="product:quality:amount" content="9.25"/>
<meta property="product:id:amount" content="1.0"/>If you want to be more specific about the tag you can change the selector:
...querySelector('meta[property="product:price:amount"][content]')...
Read more about selectors https://developer.mozilla.org/en-US/docs/Learn/CSS/Introduction_to_CSS/Selectors
5 Comments
rafaelcastrocouto
updated the answer to handle both cases. he does say that he have "a line", but it's there to help other ppl.
NewToJS
I mean other meta tags such as: Description, Keywords, Author ect....
<meta name="description" content="Meta tag exmaple"> => <meta name="keywords" content="Meta, example"> => <meta name="author" content="John Smith">rafaelcastrocouto
the updated code will handle all meta tags that have a content attribute.
NewToJS
Exactly my point. I don't think the OP wants the variable to hold the description, author and other meta tag data...
rafaelcastrocouto
then all they gotta do is to change the selector. not a big deal I guess