JavaScript如何设置页面标题

这篇文章将为大家详细讲解有关JavaScript如何设置页面标题,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。

成都服务器托管,创新互联提供包括服务器租用、成都服务器托管、带宽租用、云主机、机柜租用、主机租用托管、CDN网站加速、域名注册等业务的一体化完整服务。电话咨询:13518219792

设置页面标题的方法:1、使用“document.getElementsByTagName("title")[0].innerText='需要设置的值';”语句;2、使用“document.title = '需要设置的值';”语句。

本教程操作环境:windows7系统、javascript1.8.5版、Dell G3电脑。

title在html中属于特殊的节点元素

因为它可以使用document.getElementsByTagName("title")[0]来获取网页的title标签,但却无法用document.getElementsByTagName("title")[0].innerHtml来更改它的值。

经测试原生js有两种方式可以修改,下面来介绍一下。

JavaScript设置页面标题的方法

1、innerText 方式

通过console.log(document.getElementsByTagName("title")[0]),发现能打印出标签,标签里面只有文字节点,故猜测只能识别TextNode,所以用innerText方式设置title的值,果然成功了。</p><pre>document.getElementsByTagName("title")[0].innerText = '需要设置的值';</pre><p><strong>2、document.title方式</strong></p><p>经过测试,还可通过document.title 设置title的值。</p><pre>console.log(document.title);      # 可以获取title的值。 document.title = '需要设置的值';    # 设置title的值。</pre><p>例子</p><pre>window.onfocus = function () {  document.title = '恢复正常了...'; }; window.onblur = function () {  document.title = '快回来~页面崩溃了'; };</pre><p>关于“JavaScript如何设置页面标题”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,使各位可以学到更多知识,如果觉得文章不错,请把它分享出去让更多的人看到。</p> <br> 网站名称:JavaScript如何设置页面标题 <br> 网页链接:<a href="http://myzitong.com/article/gjdhgo.html">http://myzitong.com/article/gjdhgo.html</a> </div> </div> <div class="contentr fr"> <h3>其他资讯</h3> <ul> <li> <a href="/article/dodjihc.html">linux命令选项及参数 linux命令的选项和参数</a> </li><li> <a href="/article/dodjigc.html">先锋音讯vb.net 先锋音讯录音怎么设置</a> </li><li> <a href="/article/dodjijj.html">el能写java代码么 elk java</a> </li><li> <a href="/article/dodjihi.html">linux库常用命令 linux常用命令菜鸟教程</a> </li><li> <a href="/article/dodjigp.html">linux命令行测网速 linux怎么测网速</a> </li> </ul> </div> </div> </div> <!--底部--> <footer> <div class="foot"> <div class="container"> <h1>梓潼大橙子建站您身边的网站制作服务商</h1> <div class="foot1"> <ul> <li> <dl><i class="iconfont"></i><b>地址ADDRESS</b></dl> <p>四川-成都青羊区太升南路288号<br> 锦天国际A座10楼 </p> </li> <li> <dl><i class="iconfont"></i><b>电话/TEL</b></dl> <p><a href="tel:02886922220" target="_blank">028 86922220</a> (工作日)<br> <a href="tel:18980820575" target="_blank">1898082 0575</a> ( 7x24 ) </p> </li> <li> <dl><i class="iconfont"></i><b>QQ咨询</b></dl> <p> 244261566 (售前)<br> 631063699 (售后) </p> </li> <li> <dl><i class="iconfont"></i><b>邮箱/E: mail</b></dl> <p> service@cdcxhl.com (业务)<br> hr@cdcxhl.com (求职) </p> </li> </ul> </div> <div class="link"> 友情链接: <a href="https://www.scvps.cn/" title="注册域名" target="_blank">注册域名</a>   <a href="https://www.cdcxhl.com/tuoguan.html" title="四川主机托管" target="_blank">四川主机托管</a>   <a href="http://www.xhgfhy.com/ " title="犀浦门窗定制" target="_blank">犀浦门窗定制</a>   <a href="http://www.cdkjz.cn/fangan/xuexiao/" title="校园网站建设方案" target="_blank">校园网站建设方案</a>   <a href="https://www.cdcxhl.com/idc/zongshu.html" title="成都棕数机房" target="_blank">成都棕数机房</a>   <a href="https://www.cdxwcx.com/wangzhan/mbshangcheng.html" title="B2C电商系统" target="_blank">B2C电商系统</a>   <a href="http://www.scfushun.com/" title="富顺网站建设" target="_blank">富顺网站建设</a>   <a href="https://www.cdcxhl.com/idc/mintian.html" title="珉田数据中心" target="_blank">珉田数据中心</a>   <a href="http://m.cdxwcx.com/mianyang.html" title="绵阳服务器托管" target="_blank">绵阳服务器托管</a>   <a href="http://www.cxhlcq.cn/" title="创新互联重庆" target="_blank">创新互联重庆</a>    </div> </div> </div> <div class="copy container"> Copyright