Динамическая замена title на JavaScript и Jquery

Главная » Блог » JavaScript » Динамическая замена title на JavaScript и Jquery

Динамическая замена title на JavaScript и Jquery

Единственный более менее нормальный способ менять заголовок на лету, остальные не работали в разных браузерах.

var data = $('h1').html() + '| Умный заголовок';
document.title = data.replace( /([\s\S]+)<title>/, '' ).replace(/<\/title>([\s\S]+)/, '' );

Скрипт находит в документе текст между тегом

<h1> </h1>

, после чего он помещается между тегами

<title> </title>

с добавлением текста "| Умный заголовок". Аминь.

Здравствуйте!

Чет у меня не получилось... А как, полностью правильно записать код javascript?

Серега• 3 августа 2011 01:35

К примеру, вот так

<!DOCTYPE HTML>
<html>
<head>
<meta charset="windows-1251" />
<title>ОДИН</title>
<script src="http://code.jquery.com/jquery.min.js"></script>
<script>
$(function($){
    $('#change').click(function() {
        var data = $('h1').html(); // jQuery, поиск h1
        document.title = data.replace( /([\s\S]+)<title>/, '' ).replace(/<\/title>([\s\S]+)/, '' );
    });
});
</script>
</head>
<body>
<h1>Супер заголовок</h1>
<a href="#" id="change">Сменить тайтл на - Супер заголовок</a>
</body>
</html>

utz0r2• 3 августа 2011 10:20

Здравствуйте!

Спасибо за ответ. Так сработало, но когда смотрю исходный код, то в <title> слово не изменилось (браузер FireFox)

Серега• 3 августа 2011 12:11

А чем такой способ не устраивает?

$('#changetitle').live('click', function(){
$('title').text('новый титл');
});

<_a id='changetitle'>сменить</a>

Я• 6 августа 2011 01:32

Здравствуйте!

Честно сказать так и не понял, куда вставить этот кусок кода, чтобы все правильно заработало)

Вообще хотелось бы получить такое (в тему блога вроде бы вписывается):
Есть тег, например <p>слово</p> и чтобы это же слово вставилось в <title>старое слово - новое слово из тега </title> Только, чтобы это было в исходном коде при просмотре. Такое реально получить? Или же средствами javascript невозможно?

Серега• 12 августа 2011 17:24

Оно то поменяет, но если смотреть просто исходный код то ничего не увидите, а если инспектором (оперы) или файербагом (фаерфокс), то увидите новый тайтл.

utz0r2• 15 августа 2011 10:07

Ясно, спасибо. Как я понял поисковик тоже не увидит новый тайтл, да?)

Серега• 15 августа 2011 11:14

Да, не увидит

utz0r2• 15 августа 2011 11:16

Здравствуйте!
Все понятно. Еще раз спасибо за ответы)

Успехов Вам и Вашему блогу!

Серега• 15 августа 2011 21:49

а есть возможность обновлять title ежесекундно?

Павел• 3 ноября 2011 03:23

<!DOCTYPE HTML>
<html>
<head>
<meta charset="windows-1251" />
<title>ОДИН</title>
<script src="http://code.jquery.com/jquery.min.js"></script>
<script>
$(function($){
    setInterval(change_title, 1000);

function change_title() {
    var time=new Date();
    var data = $('h1').html(); // jQuery, поиск h1
    data = data + "и  Текущее время: " + time;
    document.title = data.replace( /([\s\S]+)<title>/, '' ).replace(/<\/title>([\s\S]+)/, '' );
}

});
</script>
</head>
<body>
<h1>Супер заголовок</h1>
Берем из h1 заголовок и подставляем время которое обновляется каждую секунду.
</body>
</html>

utz0r2• 3 ноября 2011 15:30

Отличный скрипт! В 2015 году еще более актуален для одностраничников.

Григорий• 30 октября 2015 17:57

VESELOV.SUMY.UA

Динамическая замена title на JavaScript и Jquery