如何动态修改网页的标题(title)?
有时候我们需要复用一个页面,但是又希望他们拥有各自的标题,这时候就需要动态的去更改页面的title了,不然所有页面都是一个标题。
这时候就会想到使用js或jQuery去实现了。
1、js方式。
首先,我想到了使用document.getElementsByTagName()去获取页面的title标签,这是可以获取的。例如:
<title>标题</title>
<script>
var Title = document.getElementsByTagName('title')[0]
console.log(Title) // <title>标题</title>
</script>
然而,当我想用Title.title去获取或设置值时是不生效的。
获取title值: console.log(Title.title) 会发现是无法获取到值的
同理,设置网页title值: Title.title = 'hello world!' 会发现网页的标题也是没有被更改的
所以通过这种方法是无法获取和更改网页的title的。
其实,我们可以通过document.title来直接获取title值或者设置title值的
<title>标题</title>
<script>
document.title = 'hello world!'
</script>
结果:

可以发现这个办法是行得通的。
2、jQuery方式
<title>标题</title>
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.js"></script>
<script>
$(function(){
$('title').html('hello!') // 此处也可以使用text()方法
})
</script>
如何动态修改网页的标题(title)?的更多相关文章
- 怎样查看或修改网页的标题title
网页的标题一般指的是 <title>标签之间的文本节点值, 它会显示在浏览器的标签页上, 我们可以通过 document.title 来查看或修改它: document.title; // ...
- Vue动态修改网页标题
业务需求,进入页面的时候,网页有个默认标题,加载的网页内容不同时,标题需要变更. 例:功能授权,功能授权(张三). Vue下有很多的方式去修改网页标题,这里总结下解决此问题的几种方案: 一.最笨方案 ...
- 使用JS动态修改网页body的背景色
大部分网页默认的背景色为白色,个人感觉比较刺眼,于是写了个JS的脚本去改变body部分的背景色,代码如下: // ==UserScript== // @name ChangeBackgroundCol ...
- jquery无法修改网页标题,无法修改网页标题
今天遇到一个问题,搜索时动态修改网页标题,用jquery的这段代码无效,无论FF还是IE $("title").html("new title"); 后来只好用 ...
- JS动态修改微信浏览器中的title
JS动态修改微信浏览器中的title我们的原理是设置一个ifame然后我们再加载一下就可以实现了,具体的例子如下所示. 平时使用JS修改title,直接document.title=新标题就好了 这样 ...
- 小程序block标签配合if和else 和 动态修改标题栏
<block wx:if="{{aaaa}}"> <view>aaaa为 true,显示</view> </block> <b ...
- 网页标题(title)动态改变
这是一只小白的突发奇想,实验多次终于有所效果.想要实现什么效果呢, 如图所示 : 要实现这个效果,大体需要两步. 第一,如何像打印似的一个一个字显示文字.要实现这个效果有多种方法.在这里我所运用 ...
- 基于Vue的SPA动态修改页面title的方法
最近基于VUE做个SPA手机端web发现动态修改页面标题通过document.title=xxxx 来修改着实蛋疼,而且在IOS的微信端据说没效果.百度发现要针对IOS的微信做点额外的操作,即:创建一 ...
- 聊聊 Vue 中 title 的动态修改
由于之前的 Vue 项目打包成果物一直是嵌入集成平台中,所以一直没有关注过项目的 title.直到最近,突然有个需求,要求点击按钮在集成平台外新开一个页面,此时我才发现,原来我的项目的 title 一 ...
随机推荐
- fastq,sam文件一些小结(持续补充。。。)
ST-E00211::H5L3NCCXY:::: chr14 141M = - ACTTCACCTCCTGGAGTCCTGGACTTCCCCACATCTCCCCTGCCCCTCCCACGTTTCCAT ...
- xampp的安装和配置
这几天一直在做一个网站,客户要求要用PHP修改WordPress的themes,目的是交付完成后,客户自己管理方便. 以前从没有涉及过PHP,用的是jsp,但是,既然已经选择接受,就只能让自己去适应客 ...
- Augustus安装小记
之前安装过一次Augustus,由于节点重新部署后,原来安装的硬盘被格掉了,今天重新安装的时候出了一些问题,记录一下. 1. 需要boost,安装好boost之后,虽然将其加入到~/.bashrc配置 ...
- 基于Vue+node.js的个人博客
前言 作为一个年轻的程序员,而且是作为一个未来的前端工程师,怎么能没有一个属于自己的博客呢,于是乎在暑假咸鱼了一个多月后开始了我的博客的编写. 技术栈 前端 vue.js+scss 因为当时没学vu ...
- SQLServer 索引总结
测试案例: SET STATISTICS IO ON SET STATISTICS TIME ON SET STATISTICS PROFILE ON SELECT count(A.CarrierT ...
- swift4.0 正则表达式判断手机号
p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 15.0px Menlo; color: #ffffff; background-color: #282b3 ...
- HTML5 Audio/Video 标签,属性,方法,事件汇总 (转)
HTML5 Audio/Video 标签,属性,方法,事件 <audio> 标签属性:src:音乐的URLpreload:预加载autoplay:自动播放loop:循环播放contro ...
- 15.5 自学Zabbix之路15.5 Zabbix数据库表结构简单解析-其他 表
点击返回:自学Zabbix之路 自学Zabbix之路15.5 Zabbix数据库表结构简单解析-其他 表 1. Actions表 actions表记录了当触发器触发时,需要采用的动作. 2.Aler ...
- 平衡树Treap模板与原理
这次我们来讲一讲Treap(splay以后再更) 平衡树是一种排序二叉树(或二叉搜索树),所以排序二叉树可以迅速地判断两个值的大小,当然操作肯定不止那么多(不然我们还学什么). 而平衡树在排序二叉树的 ...
- grpc 入门(一)--hello world
一,从rpc接口的定义说起,下面给一个最简单的grpc示例--hello world 在这个rpc横行的世界里,实现一个rpc很重要的一件事就是定义一个好接口,一个好的接口定义会让你省去很多麻烦.熟悉 ...