发表新帖
发表新帖

Is it possible to use JavaScript to change the meta-tags of the page?

后端 未结
关注
18 803
后悔当初
后悔当初 2020-11-22 14:14

If I put a div in the head and display:none, than use JavaScript to display it, will this work?

Edit:

I have stuff loaded in AJAX. And as my AJAX changes the

相关标签:
18条回答
  • 走了就别回头了
    2020-11-22 14:30 
    var description=document.getElementsByTagName('h4')[0].innerHTML;
var link = document.createElement('meta');
  
link.setAttribute('name', 'description');
  
link.content = description;
  
document.getElementsByTagName('head')[0].appendChild(link);
var htwo=document.getElementsByTagName('h2');
var hthree=document.getElementsByTagName('h3');
var ls=[];
for(var i=0;i<hthree.length;i++){ls.push(htwo[i].innerHTML);}

for(var i=0;i<hthree.length;i++){ls.push(hthree[i].innerHTML);}

var keyword=ls.toString()
;
var keyw = document.createElement('meta');
  
keyw.setAttribute('name', 'keywords');
  
keyw.content = keyword;
  
document.getElementsByTagName('head')[0].appendChild(keyw);

    in my case, I write this code and all my meta tags are working perfectly but we can not see the actual meta tag it will be hidden somewhere.

    0 讨论(0)
  • 生来不讨喜
    2020-11-22 14:31

    You'd use something like (with jQuery):

    $('meta[name=author]').attr('content', 'New Author Name');

    But that would be mostly pointless as meta tags are usually only scraped when the document is loaded, usually without executing any JavaScript.

    0 讨论(0)
  • 抹茶落季
    2020-11-22 14:32

    have this in index

    <link rel="opengraph" href="{http://yourPage.com/subdomain.php}"/>

    have this in ajaxfiles og:type"og:title"og:description and og: image

    and add this also

    <link rel="origin" href={http://yourPage.com}/>

    then add in js after the ajaxCall

    FB.XFBML.parse();

    Edit: You can then display the correct title and image to facebook in txt/php douments(mine are just named .php as extensions, but are more txt files). I then have the meta tags in these files, and the link back to index in every document, also a meta link in the index file for every subfile..

    if anyone knows a better way of doing this I would appreciate any additions :)

    0 讨论(0)
  • 别跟我提以往
    2020-11-22 14:34

    This seems to be working for a little rigidly geometrically set app where it needs to run on both mobile and other browsers with little change, so finding the mobile/non-mobile browser status and for mobiles setting the viewport to device-width is needed. As scripts can be run from the header, the below js in header seems to change the metatag for device-width Before the page loads. One might note that the use of navigator.userAgent is stipulated as experimental. The script must follow the metatag entry to be changed, so one must choose some initial content, and then change on some condition. 

    <meta name="viewport" content="width=device-width, initial-scale=1.0">
<script>  
  var userAgentHeader = navigator.userAgent ; 
  var browserIsMobileOrNot = "mobileNOT" ; 
  if( userAgentHeader.includes( "Mobi" ) ) { 
    browserIsMobileOrNot = "mobileYES" ; 
    //document.querySelector('meta[name="viewport"]').setAttribute( "content", "width=device-width, initial-scale=1.0" );
  } else { 
    browserIsMobileOrNot = "mobileNOT" ;  
    document.querySelector('meta[name="viewport"]').setAttribute( "content", "");
  }
</script>

<link rel="stylesheet" href="css/index.css">

    . . . . . .

    0 讨论(0)
  • 轮回少年
    2020-11-22 14:35

    It should be possible like this (or use jQuery like $('meta[name=author]').attr("content");):

    <html>
<head>
<title>Meta Data</title>
<meta name="Author" content="Martin Webb">
<meta name="Author" content="A.N. Other">
<meta name="Description" content="A sample html file for extracting meta data">
<meta name="Keywords" content="JavaScript, DOM, W3C">

</head>

<body>
<script language="JavaScript"><!--
if (document.getElementsByName) {
  var metaArray = document.getElementsByName('Author');
  for (var i=0; i<metaArray.length; i++) {
    document.write(metaArray[i].content + '<br>');
  }

  var metaArray = document.getElementsByName('Description');
  for (var i=0; i<metaArray.length; i++) {
    document.write(metaArray[i].content + '<br>');
  }

  var metaArray = document.getElementsByName('Keywords');
  for (var i=0; i<metaArray.length; i++) {
    document.write(metaArray[i].content + '<br>');
  }
}
//--></script>
</body>

</html>
    0 讨论(0)
  • 梦如初夏
    2020-11-22 14:35

    Yes, it is possible to add metatags with Javascript. I did in my example

    Android not respecting metatag removal?

    But, I dont know how to change it other then removing it. Btw, in my example.. when you click the 'ADD' button it adds the tag and the viewport changes respectively but I dont know how to revert it back (remove it, in Android).. I wish there was firebug for Android so I saw what was happening. Firefox does remove the tag. if anybody has any ideas on this please note so in my question.

    0 讨论(0)
 看不清?
提交回复
热议问题