如何使用 JavaScript 动态更改网页标题？

给定一个包含页面标题的网页，任务是使用 JavaScript 动态更改网页的标题。

方法一：使用 document.title 属性： document.title属性用于设置或返回文档的当前标题。可以通过将新标题作为字符串分配给该属性来更改页面标题。这会将网站的标题更改为首选标题。
句法：

newPageTitle = 'The title has changed!';
document.title = newPageTitle;

例子：

  

    
        How to dynamically change a web
        page’s title using JavaScript ?
    

  

    
        GeeksforGeeks
    
      
    
        How to dynamically change a web
        page’s title using JavaScript ?
    
      
    
        Click on the button to change the page
        title to: "The title has changed!"
    
      
    
        Change Page Title
    
      
    
        function changePageTitle() {
            newPageTitle = 'The title has changed!';
            document.title = newPageTitle;
        }
    

  

输出：

• 在点击按钮之前：
  
• 点击按钮后：
  

方法2：使用querySelector() 方法： document.querySelector()方法用于选择文档中的元素。可以通过将选择器中的标题元素指定为参数来选择标题元素。这将返回页面的当前标题元素。

元素的textContent属性返回特定节点的文本内容。可以通过将所需的新标题作为字符串分配给 textContent 属性来更改页面标题。这会将网站的标题更改为首选标题。

句法：

newPageTitle = 'The title has changed!';
document.querySelector('title').textContent = newPageTitle;

例子：

  

    
        How to dynamically change a web
        page’s title using JavaScript ?
    

  

    
        GeeksforGeeks
    
      
    
        How to dynamically change a web
        page’s title using JavaScript ?
    
      
    
        Click on the button to change the page
        title to: "The title has changed!"
    
      
    
        Change Page Title
    
      
    
        function changePageTitle() {
            newPageTitle = 'The title has changed!';
            document.querySelector('title').textContent
                    = newPageTitle;
        }
    

  

输出：

• 在点击按钮之前：
  
• 点击按钮后：