Можно ли использовать JavaScript для изменения мета-тегов страницы? - PullRequest
Новая
       26

Можно ли использовать JavaScript для изменения мета-тегов страницы?

89 голосов
/ 02 апреля 2010

Если я положу в голову div и покажу: нет, чем использовать JavaScript для его отображения, будет ли это работать?

Edit:

У меня есть вещи, загруженные в AJAX. И когда мой AJAX меняет «основную» часть сайта, я хочу изменить и метатеги.

Ответы [ 15 ]

156 голосов
/ 03 апреля 2010

Да, вы можете сделать это.

Существует несколько интересных вариантов использования: некоторые браузеры и плагины анализируют метаэлементы и изменяют свое поведение для различных значений.

Примеры

Skype: отключить анализатор телефонных номеров 

<meta name="SKYPE_TOOLBAR" content="SKYPE_TOOLBAR_PARSER_COMPATIBLE">

iPhone: отключить анализатор телефонных номеров 

<meta name="format-detection" content="telephone=no">

Google Chrome Frame 

<meta http-equiv="X-UA-Compatible" content="chrome=1">

Определение области просмотра для мобильных устройств 

<meta name="viewport" content="width=device-width, initial-scale=1.0">

Это можно изменить с помощью JavaScript. См .: Исправление ошибки масштабирования области просмотра iPhone

мета-описание

Некоторые пользовательские агенты (например, Opera) используют описание для закладок. Вы можете добавить персонализированный контент здесь. Пример: 

<!DOCTYPE html>
<title>Test</title>
<meta name="description" content="this is old">
<script type='text/javascript' src='http://code.jquery.com/jquery-1.8.2.js'></script>

<button>Change description</button>

<script type='text/javascript'>
$('button').on('click', function() {
    // Just replacing the value of the 'content' attribute will not work.
    $('meta[name=description]').remove();
    $('head').append( '<meta name="description" content="this is new">' );
});
</script>

Итак, речь идет не только о поисковых системах.

97 голосов
/ 18 марта 2016

Да, это так.

например. установить мета-описание: 

document.querySelector('meta[name="description"]').setAttribute("content", _desc);
64 голосов
/ 02 апреля 2010

Вы бы использовали что-то вроде (с jQuery): 

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

Но это было бы в основном бессмысленно, поскольку метатеги обычно очищаются только при загрузке документа, обычно без выполнения какого-либо JavaScript.

33 голосов
/ 23 ноября 2010

Вы можете изменить мета, например, с помощью вызовов jQuery, например: 

$('meta[name=keywords]').attr('content', new_keywords);
$('meta[name=description]').attr('content', new_description);

Я думаю, что имеет значение на данный момент, поскольку google сказал , что они будут индексировать контент ajax с помощью вызовов #!hashes и _escaped_fragment_. И теперь они могут проверить это (даже автоматически, с помощью безголовых браузеров, см. Ссылку «Создание снимков HTML» на странице, упомянутой выше), так что я думаю, что это путь для хардкорных парней SEO.

16 голосов
/ 10 ноября 2017

Определенно возможно использовать Javascript для изменения мета-тегов страницы. Вот только подход Javascript: 

document.getElementsByTagName('meta')["keywords"].content = "My new page keywords!!";
document.getElementsByTagName('meta')["description"].content = "My new page description!!";
document.title = "My new Document Title!!";

Я подтвердил, что Google индексирует эти изменения на стороне клиента для приведенного выше кода.

11 голосов
/ 02 апреля 2010

Это должно быть возможно так (или использовать jQuery, как $('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>
11 голосов
/ 02 апреля 2010

метатеги являются частью dom и могут быть доступны и -i догадываться, но поисковые системы (основные потребители мета-тегов) не увидят изменения, так как JavaScript не будет выполнен так что если вы не меняете метатег (который приходит на ум), который имеет значение в браузере, это может оказаться бесполезным?

10 голосов
/ 17 апреля 2014 
$(document).ready(function() {
  $('meta[property="og:title"]').remove();
  $('meta[property="og:description"]').remove();
  $('meta[property="og:url"]').remove();
  $("head").append('<meta property="og:title" content="blubb1">');
  $("head").append('<meta property="og:description" content="blubb2">');
  $("head").append('<meta property="og:url" content="blubb3">');
});
5 голосов
/ 20 марта 2014 
var metaTag = document.getElementsByTagName('meta');
for (var i=0; i < metaTag.length; i++) {
    if (metaTag[i].getAttribute("http-equiv")=='refresh')
        metaTag[i].content = '666';
    if (metaTag[i].getAttribute("name")=='Keywords')
        metaTag[i].content = 'js, solver';
}
2 голосов
/ 26 января 2013

простое добавление и атрибут div для каждого примера метатега 

<meta id="mtlink" name="url" content="">
<meta id="mtdesc" name="description" content="" />
<meta id="mtkwrds" name="keywords" content="" />

теперь как обычное изменение div для ex. n нажмите 

<a href="#" onClick="changeTags(); return false;">Change Meta Tags</a>

функция изменения тегов с помощью jQuery 

function changeTags(){
   $("#mtlink").attr("content","http://albup.com");
   $("#mtdesc").attr("content","music all the time");
   $("#mtkwrds").attr("content","mp3, download music, ");

}
Страница:
...