JavaScript |获取 span 元素的文本

给定一个 HTML 文档，任务是获取 元素的文本。有两种方法用于获取 span 元素，如下所述：

• HTML DOM textContent 属性：此属性设置/返回已定义节点及其所有后代的文本内容。通过设置 textContent 属性，子节点将被移除并替换为具有指定字符串的单个 Text 节点。

  句法：

  • 返回节点的文本内容。

    node.textContent
    

  • 设置节点的文本内容。

    node.textContent = text
    

  属性值：它包含指定指定节点的文本内容的单值文本。

  返回值：它返回一个字符串，代表节点及其所有后代的文本。如果元素是文档、文档类型或符号，则返回 null。

• HTML DOM innerText 属性：此属性设置/返回已定义节点及其所有后代的文本内容。通过设置 innerText 属性，所有子节点都将被删除，并由具有指定字符串的单个 Text 节点替换。

  句法：

  • 返回节点的文本内容。

    node.innerText
    

  • 设置节点的文本内容。

    node.innerText = text
    

  属性值：它包含指定指定节点的文本内容的单值文本。

  返回值：它返回一个字符串，表示一个节点及其所有后代的“渲染”文本内容。

示例 1：本示例使用textContent 属性获取内容。

 
 
     
         
            JavaScript | Get the text of a span element
        
     
      
     
          
         
            GeeksForGeeks 
         
          
         
            This is text of Span element. 
        
          
        
          
         
            Click here
        
          
        
        
          
        
            var span = document.getElementById("GFG_Span");
            var el_down = document.getElementById("GFG_DOWN");
              
            function gfg_Run() {
                el_down.innerHTML = span.textContent;
            }         
         
     
                    

输出：

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

示例 2：本示例使用innerText 属性获取内容。

 
 
     
         
            JavaScript | Get the text of a span element
        
     
      
     
      
         
            GeeksForGeeks 
         
      
         
            This is text of Span element. 
        
      
        
          
         
            Click here
        
          
        
        
          
        
            var span = document.getElementById("GFG_Span");
            var el_down = document.getElementById("GFG_DOWN");
              
            function gfg_Run() {
                el_down.innerHTML = span.innerText;
            }         
         
     
                    

输出：

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