如何動態修改網頁的標題（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>