자바 스크립트를 사용하여 문서 제목 회전

Question

JS를 사용하여 웹 페이지 문서 제목을 회전 시키려고합니다. 따라서 예를 들면 다음과 같습니다.

Domain.com ~ New Messgae - Domain.com으로 변경하고 다시 Domain.com으로 돌아가는 등 채팅을 사용할 때 페이스 북이 새 메시지로 어떻게 처리하는지와 매우 비슷합니다.

SetInterval을 사용했지만 하나의 표현식 만 제외하고 사용 했습니까? 이를 변경하거나 SetInterval을 사용하여 잘못된 함수를 사용하고 있습니까?

 $(document).ready(function() { 

      setInterval(function() 
      { 
        $(document).attr('title', 'New Message — Domain.com'); 
      }, 
      2000); 

     }); 

Answer 1

바로 지금 새 제목을 2 초마다 설정합니다. 즉, 처음 변경 한 후에는 변경 사항이 표시되지 않습니다. 당신은 이전 및 새 제목을 표시, 두 상태 사이에 이전의 제목과 대체를 저장해야합니다

var oldTitle, timerId; 

function flashTitle(newTitle) { 
    var state = false; 
    oldTitle = document.title; // save old title 
    timerId = setInterval(flash, 2000); 

    function flash() { 
    // switch between old and new titles 
    document.title = state ? oldTitle : newTitle; 
    state = !state; 
    } 
} 

function clearFlash() { 
    clearInterval(timerId); 
    document.title = oldTitle; // restore old title 
} 

Answer 2

그럼 당신과 같이 자바 스크립트 라이브러리를 사용하지 않고 그것을 할 수 ...

var title = document.getElementsByTagName('title'); 
var msg1 = "Domain.com"; 
var msg2 = "New Message - Domain.com" 
var current; 
var titleChange; 

function changeTitle(){ 
    if(current == msg1){ 
    title = msg2; 
    current = msg2; 
    }else{ //If the current title isn't equal to the value of msg1 
    title = msg1; 
    current = msg1; 
    } 
titleChange = setTimeout("changeTitle()", 1000); 
} 

function stopChangingTitle(){ 
clearTimeout(titleChange); 
title = msg1; 
} 

나는 위의 코드 작동을 보장 할 수 없습니다,하지만 작동합니다!

Answer 3

$(document).ready(function() { 
     var titles=['title1','title2','title3']; 

     setInterval(function() 
     {  
       $(document).attr('title', titles[0]); 
       titles.push(titles.shift()); 
     }, 
     2000); 

    }); 

Answer 4

이 내가 Dr.Molle의 솔루션을 사용 해낸 것입니다. 나는 내가 setInterval을 주위에 자전거를 중지 얻을 수가 없습니다 함수 외부 title_change를 선언 할 때 나는 그러나 찾았어요

function changeTitle (mytitle,count) { 
    console.log(title_change); 
    console.log(count); 
    if (count >= 1) { 
     var titles = [$('title').attr('data-title'),mytitle]; 
     title_change = setInterval(function(){  
      $(document).attr('title', titles[0]); 
      titles.push(titles.shift()); 
     }, 
     1000); 


    } else { 
     clearInterval(title_change); 
     //clearTimeout(title_change); 
     title_change = false; 
    } 

     return false; 

} 

. 카운트가 1보다 커지면 프로세스가 시작되지만 0으로 돌아 오면 clearInterval 및 clearTimeout이 change_loop을 중지하지 않습니다.