Question

我正在尝试根据计时器更改标签的标题。

我在网上找到了一个例子，但无法让它工作，我也不知道它是否支持多个页面标题。感谢先进，仍在学习。

<!DOCTYPE html>
<html>
<head>
<title>Test</title>

<script 
src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.
min.js"> 
</script>

<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
<script type="text/javascript" src="Script.js"></script>

</head>
<body>
</body>
</html>

$(function() {

    var origTitle, animatedTitle, timer;

    function animateTitle(newTitle) {
        var currentState = false;
        origTitle = document.title; // save original title
        animatedTitle = "Hey There! " + origTitle;
        timer = setInterval(startAnimation, 20);

        function startAnimation() {
            // animate between the original and the new title
            document.title = currentState ? origTitle : animatedTitle;
            currentState = !currentState;
        }
    }

Answer 1

这是一个每8秒更改一次标题的示例。

<!DOCTYPE html>
<html>
<head>
    <title>Test</title>
</head>
<body>
    <script>
        var counter = 0;
        setInterval( function () {
            counter = counter + 1;
            document.title = "Iteration: " + counter;
        }, 8000 );
    </script>
</body>
</html>

要在Script.js文件中与jQuery结合使用，您可能希望将其全部包装在$(document).ready( function() {...} );

中

<强>更新
以下是每8秒显示一个不同名称的示例。

<!DOCTYPE html>
<html>

<head>
    <title>Hello there!</title>
</head>

<body>
    <script>
        var names = [ "Rick", "Michonne", "Darryl", "Rosita", "Negan" ];
        var counter = 0;
        setInterval( function () {
            document.title = "Hello " + names[ counter ];
            if ( counter == names.length - 1 ) {
                counter = 0;
            } else {
                counter = counter + 1;
            }
        }, 8000 );
    </script>
</body>

</html>

用户选择另一个选项卡，页面标题每8秒更改为一个不同的标题

1 个答案: