Les informations dont j'ai besoin sont dans une balise META. Comment puis-je accéder aux données "content"
de la balise meta lorsque property="video"
?
HTML:
<meta property="video" content="http://video.com/video33353.mp4" />
Vous pouvez utiliser ceci:
function getMeta(metaName) {
const metas = document.getElementsByTagName('meta');
for (let i = 0; i < metas.length; i++) {
if (metas[i].getAttribute('name') === metaName) {
return metas[i].getAttribute('content');
}
}
return '';
}
console.log(getMeta('video'));
Les autres réponses devraient probablement faire l'affaire, mais celle-ci est plus simple et ne nécessite pas jQuery:
document.head.querySelector("[property~=video][content]").content;
Très difficile à lire, répondez ici. Une doublure ici
document.querySelector("meta[property='og:image']").getAttribute("content");
function getMetaContentByName(name,content){
var content = (content==null)?'content':content;
return document.querySelector("meta[name='"+name+"']").getAttribute(content);
}
Utilisé de cette façon:
getMetaContentByName("video");
L'exemple sur cette page:
getMetaContentByName("Twitter:domain");
Il y a un moyen plus facile:
document.getElementsByName('name of metatag')[0].getAttribute('content')
$("meta[property='video']").attr('content');
Dans Jquery, vous pouvez y parvenir avec:
$("meta[property='video']");
En JavaScript, vous pouvez y parvenir avec:
document.getElementsByTagName('meta').item(property='video');
Manière - [1]
function getMetaContent(property, name){
return document.head.querySelector("["+property+"="+name+"]").content;
}
console.log(getMetaContent('name', 'csrf-token'));
Vous pouvez obtenir l'erreur suivante: Uncaught TypeError: Impossible de lire la propriété 'getAttribute' de null
Manière - [2]
function getMetaContent(name){
return document.getElementsByTagName('meta')[name].getAttribute("content");
}
console.log(getMetaContent('csrf-token'));
Vous pouvez obtenir l'erreur suivante: Uncaught TypeError: Impossible de lire la propriété 'getAttribute' de null
Manière - [3]
function getMetaContent(name){
name = document.getElementsByTagName('meta')[name];
if(name != undefined){
name = name.getAttribute("content");
if(name != undefined){
return name;
}
}
return null;
}
console.log(getMetaContent('csrf-token'));
Au lieu d’obtenir une erreur, vous obtenez null
, c’est bien.
Ce code fonctionne pour moi
<meta name="text" property="text" content="This is text" />
<meta name="video" property="text" content="http://video.com/video33353.mp4" />
JS
var x = document.getElementsByTagName("META");
var txt = "";
var i;
for (i = 0; i < x.length; i++) {
if (x[i].name=="video")
{
alert(x[i].content);
}
}
Exemple de violon: http://jsfiddle.net/muthupandiant/ogfLwdwt/
function getDescription() {
var info = document.getElementsByTagName('meta');
return [].filter.call(info, function (val) {
if(val.name === 'description') return val;
})[0].content;
}
version de mise à jour:
function getDesc() {
var desc = document.head.querySelector('meta[name=description]');
return desc ? desc.content : undefined;
}
Personnellement, je préfère simplement les mettre dans un objet hash, alors je peux y accéder n'importe où. Cela pourrait facilement être réglé sur une variable injectable et tout pourrait alors l’avoir et il n’a été saisi qu’une fois.
En encapsulant la fonction, cela peut également être fait en une couche.
var meta = (function () {
var m = document.querySelectorAll("meta"), r = {};
for (var i = 0; i < m.length; i += 1) {
r[m[i].getAttribute("name")] = m[i].getAttribute("content")
}
return r;
})();
À titre d'information, les attributs globaux https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta sont valides, ce qui signifie que l'attribut id
PEUT &ECIRC;TRE UTILIS&EACUTE; AVEC getElementById
.
Voici une fonction qui renverra le contenu de toute balise meta et mémorisera le résultat, en évitant les requêtes inutiles sur le DOM.
var getMetaContent = (function(){
var metas = {};
var metaGetter = function(metaName){
var theMetaContent, wasDOMQueried = true;;
if (metas[metaName]) {
theMetaContent = metas[metaName];
wasDOMQueried = false;
}
else {
Array.prototype.forEach.call(document.getElementsByTagName("meta"), function(el) {
if (el.name === metaName) theMetaContent = el.content;
metas[metaName] = theMetaContent;
});
}
console.log("Q:wasDOMQueried? A:" + wasDOMQueried);
return theMetaContent;
}
return metaGetter;
})();
getMetaContent("description"); /* getMetaContent console.logs the content of the description metatag. If invoked a second time it confirms that the DOM was only queried once */
Et voici une version étendue qui interroge également les balises des graph graphs ouverts , et utilise Array # some :
var getMetaContent = (function(){
var metas = {};
var metaGetter = function(metaName){
wasDOMQueried = true;
if (metas[metaName]) {
wasDOMQueried = false;
}
else {
Array.prototype.some.call(document.getElementsByTagName("meta"), function(el) {
if(el.name === metaName){
metas[metaName] = el.content;
return true;
}
if(el.getAttribute("property") === metaName){
metas[metaName] = el.content;
return true;
}
else{
metas[metaName] = "meta tag not found";
}
});
}
console.info("Q:wasDOMQueried? A:" + wasDOMQueried);
console.info(metas);
return metas[metaName];
}
return metaGetter;
})();
getMetaContent("video"); // "http://video.com/video33353.mp4"