Jqueryでページタイトルを変更する


回答:


186
$(document).prop('title', 'test');

これは単に次のJQueryラッパーです。

document.title = 'test';

>を定期的に追加するには、次のようにします。

function changeTitle() {
    var title = $(document).prop('title'); 
    if (title.indexOf('>>>') == -1) {
        setTimeout(changeTitle, 3000);  
        $(document).prop('title', '>'+title);
    }
}

changeTitle();

setTimeoutsの文字列ではなく、setIntervalとclearIntervalを使用する方がよいのではないでしょうか。
Spycho 2011

1
jQueryを介してページを呼び出すSEOにはどのような影響がありますか?
TheBlackBenzKid 2014年

20

タイトルを変更するためにjQueryを使用する必要はありません。試してみてください:

document.title = "blarg";

詳細については、この質問を参照してください。

ボタンクリックで動的に変更するには:

$(selectorForMyButton).click(function(){
    document.title = "blarg";
});

ループ内で動的に変更するには、次のことを試してください。

var counter = 0;

var titleTimerId = setInterval(function(){
    document.title = document.title + '>';
    counter++;
    if(counter == 5){
        clearInterval(titleTimerId);
    }
}, 100);

ボタンのクリック時に動的に変化するように2つをつなぎ合わせるには、次のようにします。

var counter = 0;

$(selectorForMyButton).click(function(){
  titleTimerId = setInterval(function(){
    document.title = document.title + '>';
    counter++;
    if(counter == 5){
        clearInterval(titleTimerId);
    }
  }, 100);
});

ユーザーがボタンをクリックすると、タイトルが問題のように変更され、この変更がループされます
Ilya Medvedev

4

を使用して

$('title').html("new title");

私は知っていますが、どのように動的にそれを作るのですか?
イリヤメドベージェフ

2
これは動的です。つまり、Javascriptを使用します。たまたま「アニメ化」という意味ですか?
darma 2011

@IIya:より良い答えを得るために、より多くのマークアップとコードを提供します。あなたの質問は不明確です。
ゴウリ

3

 var isOldTitle = true;
        var oldTitle = document.title;
        var newTitle = "New Title";
        var interval = null;
        function changeTitle() {
            document.title = isOldTitle ? oldTitle : newTitle;
            isOldTitle = !isOldTitle;
        }
        interval = setInterval(changeTitle, 700);

        $(window).focus(function () {
            clearInterval(interval);
            $("title").text(oldTitle);
        });


2

私は使用します(そしてお勧めします):

$(document).attr("title", "Another Title");

IEでも動作しますこれはエイリアスです

document.title = "Another Title";

小道具と属性のどちら良いかについて議論する人もいます、propはDOMプロパティを呼び出し、attrはHTMLプロパティを呼び出すので、これは実際には優れていると思います...

DOMロード後にこれを使用します

$(function(){
    $(document).attr("title", "Another Title");
});

お役に立てれば。


1

タイトルのリストをウォークスルーするためのいくつかのコード(循環的またはワンショット):

    var titles = [
            " title",
            "> title",
            ">> title",
            ">>> title"
    ];

    // option 1:
    function titleAniCircular(i) {
            // from first to last title and back again, forever
            i = (!i) ? 0 : (i*1+1) % titles.length;
            $('title').html(titles[i]);
            setTimeout(titleAniCircular, 1000, [i]);
    };

    // option 2:
    function titleAniSequence(i) {
            // from first to last title and stop
            i = (!i) ? 0 : (i*1+1);
            $('title').html(titles[i]);
            if (i<titles.length-1) setTimeout(titleAniSequence, 1000, [i]);
    };

    // then call them when you like.
    // e.g. to call one on document load, uncomment one of the rows below:

    //$(document).load( titleAniCircular() );
    //$(document).load( titleAniSequence() );


1

HTMLコード:

Change Title:
<input type="text" id="changeTitle" placeholder="Enter title tag">
<button id="changeTitle1">Click!</button>

Jqueryコード:

$(document).ready(function(){   
    $("#changeTitle1").click(function() {
        $(document).prop('title',$("#changeTitle").val()); 
    });
});

0
document.title="your title";

私はこれが好きです。


これは、既存の回答の単なる繰り返しです。
パン

0

jqueryでページタイトルを変更する非常に簡単な方法。

<a href="#" id="changeTitle">Click!</a>

ここでJqueryメソッド:

$(document).ready(function(){   
    $("#changeTitle").click(function() {
       $(document).prop('title','I am New One');
    });
});
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.