[js]titleを動的に変更する方法

youtubeとかchatworkとかで通知があったときにtitleが変更される。
どうやってんのかなってことで、根っこのところを確認。

Demo

ボタンで変更するように組んだ。
http://test.megefeps.info/20181115_title/

jQueryで変更

<!doctype html>
<html>
<head>
	<meta charset="utf-8">
	<title>タイトル変更</title>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
</head>
<body>
	<script>
		$(function(){
			$('#btnjQuery').click(function(){
				$('title').html('jQueryでtitle変更');
			});
		});
	</script>
	<button id="btnjQuery">jQueryで変更</button>
</body>
</html>

要するにこれ。

$('title').html('hogehoge');

javascriptで変更

<!doctype html>
<html>
<head>
	<meta charset="utf-8">
	<title>タイトル変更</title>
</head>
<body>
	<script>
		function btnJS(){
			document.title = 'javascriptでtitle変更';
		};
	</script>
	<h1>titleを動的に変更する</h1>
	<button onclick="btnJS();">javascriptで変更</button>
</body>
</html>

要するにこれ。

document.title = 'hogehoge';

使い所

jsでtitleを変更しても上っ面が変わってるだけで、htmlに記述されているtitleは直接記述されたもののまま。
つまりSEO的に得をすることは一切ないので、データベースとして内輪で何やかやするサイトとかで、その場しのぎの要素というか、おまけというか、そんな感じで。
無理して使う理由はなんにもないので、片手間というかなんというかって感じ。
でもシステムで組むならphpとかでも書けるわけで、ソースを汚したくないけど変えたいみたいな時とか。
実用性は結構薄いというか、かなり限定されてると思う。

コメント

タイトルとURLをコピーしました