[英]Changing the page title with Jquery
如何使用jquery动态更改<title>
标签?
示例:逐个添加3个>
符号
> title
>> title
>>> title
$(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();
没有必要使用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);
要将两者串在一起,以便在按钮单击时动态更改,在循环中:
var counter = 0;
$(selectorForMyButton).click(function(){
titleTimerId = setInterval(function(){
document.title = document.title + '>';
counter++;
if(counter == 5){
clearInterval(titleTimerId);
}
}, 100);
});
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); });
运用
$('title').html("new title");
我用这个:
document.title = "your_customize_title";
我使用(并推荐):
$(document).attr("title", "Another Title");
它在IE中工作,这也是一个别名
document.title = "Another Title";
有些人会辩论更好,prop或attr ,并且因为prop调用DOM属性和attr调用HTML属性,我认为这实际上更好......
在DOM Load之后使用它
$(function(){
$(document).attr("title", "Another Title");
});
希望这可以帮助。
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());
});
});
一些代码遍历标题列表(循环或一次性):
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() );
document.title="your title";
我更喜欢这个。
用jquery更改页面标题的简单方法..
<a href="#" id="changeTitle">Click!</a>
这里是Jquery方法:
$(document).ready(function(){
$("#changeTitle").click(function() {
$(document).prop('title','I am New One');
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.