मुझे जो जानकारी चाहिए वह मेटा टैग में है। मैं "content"मेटा टैग के डेटा को कब तक एक्सेस कर सकता हूं property="video"?
HTML:
<meta property="video" content="http://video.com/video33353.mp4" />मुझे जो जानकारी चाहिए वह मेटा टैग में है। मैं "content"मेटा टैग के डेटा को कब तक एक्सेस कर सकता हूं property="video"?
HTML:
<meta property="video" content="http://video.com/video33353.mp4" />जवाबों:
आप इसका उपयोग कर सकते हैं:
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'));document.querySelector("meta[property='og:url']").getAttribute('content')
const/ letसमर्थन करना चाहिए .querySelector!
अन्य उत्तरों को शायद चाल चलनी चाहिए, लेकिन यह सरल है और इसे jQuery की आवश्यकता नहीं है:
document.head.querySelector("[property~=video][content]").content;मूल प्रश्न एक विशेषता के साथ RDFa टैग का उपयोग करता है property=""। सामान्य HTML <meta name="" …>टैग के लिए आप कुछ का उपयोग कर सकते हैं:
document.querySelector('meta[name="description"]').contentdocument.head.querySelectorमुझे दिया nullलेकिन document.querySelectorपूरी तरह से काम किया
[content]चयनकर्ता में शामिल करना उस मामले को छोड़ देता है जहां किसी भी मिलान टैग में सामग्री विशेषता का अभाव होता है। IMO यह एक अशक्त परिणाम प्राप्त करने के लिए उस मामले में अधिक समझ में आता है, लेकिन यह कार्यान्वयनकर्ता की प्राथमिकता पर निर्भर करता है।
एक आसान तरीका है:
document.getElementsByName('name of metatag')[0].getAttribute('content')document.querySelectorसंस्करण IE8 करने के लिए सभी तरह से काम करता है, तो यह की बहुत
function getMetaContentByName(name,content){
var content = (content==null)?'content':content;
return document.querySelector("meta[name='"+name+"']").getAttribute(content);
}इस तरह से उपयोग किया जाता है:
getMetaContentByName("video");इस पृष्ठ पर उदाहरण:
getMetaContentByName("twitter:domain");type errorरूप undefinedहो रहा था क्योंकि मेटा टैग स्वयं गायब था। मैंने हल किया कि एक चर को असाइन करके और document.queryselectorएक कोशिश बयान में लपेटकर ताकि मैं ""त्रुटि के मामले में डिफ़ॉल्ट रूप से प्राप्त कर सकूं।
यदि आप JQuery का उपयोग करते हैं, तो आप उपयोग कर सकते हैं:
$("meta[property='video']").attr('content');Jquery में आप इसे प्राप्त कर सकते हैं:
$("meta[property='video']");जावास्क्रिप्ट में आप इसे प्राप्त कर सकते हैं:
document.getElementsByTagName('meta').item(property='video');document.getElementsByTagName('meta')['video'].getAttribute('content');यदि मार्कअप नीचे है:<meta name="video" content="http://video.com/video33353.mp4" />
रास्ता - [ १ ]
function getMetaContent(property, name){
return document.head.querySelector("["+property+"="+name+"]").content;
}
console.log(getMetaContent('name', 'csrf-token'));आपको त्रुटि मिल सकती है: अनकैप्ड टाइपर्रर: प्रॉपर्टी को रीड नहीं कर सकता है
रास्ता - [ २ ]
function getMetaContent(name){
return document.getElementsByTagName('meta')[name].getAttribute("content");
}
console.log(getMetaContent('csrf-token'));आपको त्रुटि मिल सकती है: अनकैप्ड टाइपर्रर: प्रॉपर्टी को रीड नहीं कर सकता है
रास्ता - [ ३ ]
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'));त्रुटि मिलने के बजाय, आपको मिलता है null, यह अच्छा है।
सरल एक, सही?
document.head.querySelector("meta[property=video]").contentयह कोड मेरे लिए काम करता है
<meta name="text" property="text" content="This is text" />
<meta name="video" property="text" content="http://video.com/video33353.mp4" />जे एस
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);
}
} उदाहरण फिडल: 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;
}नया संस्करण:
function getDesc() {
var desc = document.head.querySelector('meta[name=description]');
return desc ? desc.content : undefined;
}यहाँ एक फ़ंक्शन है जो किसी भी मेटा टैग की सामग्री को लौटाएगा और 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 */और यहाँ एक विस्तारित संस्करण है जो खुले ग्राफ़ टैग के लिए भी पूछताछ करता है, और 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"समारोह का मेरा प्रकार:
const getMetaValue = (name) => {
const element = document.querySelector(`meta[name="${name}"]`)
return element?.getAttribute('content')
}मैं व्यक्तिगत रूप से उन्हें केवल एक ऑब्जेक्ट हैश में लाना पसंद करता हूं, फिर मैं उन्हें कहीं भी एक्सेस कर सकता हूं। यह आसानी से एक इंजेक्शन चर के लिए सेट किया जा सकता है और फिर सब कुछ हो सकता है और यह केवल एक बार पकड़ा।
फ़ंक्शन को लपेटकर यह एक लाइनर के रूप में भी किया जा सकता है।
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;
})();FYI करें https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta वैश्विक विशेषताओं के अनुसार मान्य हैं, जिसका अर्थ है कि idविशेषता का उपयोग किया जा सकता हैgetElementById ।
<html>
<head>
<meta property="video" content="http://video.com/video33353.mp4" />
<meta name="video" content="http://video.com/video33353.mp4" />
</head>
<body>
<script>
var meta = document.getElementsByTagName("meta");
size = meta.length;
for(var i=0; i<size; i++) {
if (meta[i].getAttribute("property") === "video") {
alert(meta[i].getAttribute("content"));
}
}
meta = document.getElementsByTagName("meta")["video"].getAttribute("content");
alert(meta);
</script>
</body>
</html>यदि आप सभी मेटा टैग पाने के लिए अधिक दूरगामी समाधान में इंटरसेस्ट हैं तो आप इस कोड का उपयोग कर सकते हैं
function getAllMetas() {
var metas = document.getElementsByTagName('meta');
var summary = [];
Array.from(metas)
.forEach((meta) => {
var tempsum = {};
var attributes = meta.getAttributeNames();
attributes.forEach(function(attribute) {
tempsum[attribute] = meta.getAttribute(attribute);
});
summary.push(tempsum);
});
return summary;
}
// usage
console.log(getAllMetas());यदि मेटा टैग है:
<meta name="url" content="www.google.com" />JQuery होगा:
const url = $('meta[name="url"]').attr('content'); // url = 'www.google.com'जावास्क्रिप्ट होगा: (यह संपूर्ण HTML लौटाएगा)
const metaHtml = document.getElementsByTagName('meta').url // metaHtml = '<meta name="url" content="www.google.com" />'
<meta>एकnameविशेषता होनी चाहिए , नहींproperty। मानक विशेषता का उपयोग करने वाले डेवलपर्स को अधिकांश उत्तरों द्वारा दिए गए कोड को अनुकूलित करने की आवश्यकता होगी।