如何使用 JavaScript/jQuery 删除所有内联样式？

给定一个包含内联和内部 CSS 的 HTML 文档，任务是在 JavaScript 的帮助下从特定元素中删除内联 CSS 样式。

方法： jQuery attr() 和 removeAttr()方法用于删除内联样式属性。 attr() 方法将属性值设置为空 (”)。

示例 1：此示例使用attr() 方法删除内联样式。

  

    
        How to remove all inline styles
        using JavaScript/jQuery ?
    
      
    
    
      
    
        .parent {
            background: green;
        }
        .child1 {
            background: blue;
            margin: 10px;
        }
        .child2 {
            background: red;
            margin: 10px;
        }
    

  

      
     
        GeeksforGeeks 
    
      
    
    
      
    
        Parent
        
            Child1
        
        
            Child2
        
    
    
      
    
        click here
    
      
    
    
      
    
        var up = document.getElementById('GFG_UP');
        var down = document.getElementById('GFG_DOWN');
        var parent = document.getElementById('parent');
          
        up.innerHTML = "Click on the button to remove"
                            + " the inline style.";
  
        function GFG_Fun() {
            $('#parent').attr('style', '');
            down.innerHTML = "Inline style has been removed.";
        }
    

  

输出：

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

示例 2： jQuery removeAttr() 方法用于删除内联样式属性。 removeAttr() 方法删除 style 属性的值。

  

    
        How to remove all inline styles
        using JavaScript/jQuery ?
    
      
    
    
      
    
        .parent {
            background: green;
        }
        .child1 {
            background: blue;
            margin: 10px;
        }
        .child2 {
            background: red;
            margin: 10px;
        }
    

  

      
     
        GeeksforGeeks 
    
      
    
    
      
    
        Parent
        
            Child1
        
        
            Child2
        
    
    
      
    
        click here
    
      
    
    
      
    
        var up = document.getElementById('GFG_UP');
        var down = document.getElementById('GFG_DOWN');
        var parent = document.getElementById('parent');
          
        up.innerHTML = "Click on the button to remove "
                        + "the inline style.";
  
        function GFG_Fun() {
            $('#parent').removeAttr('style');
            down.innerHTML = "Inline style has been removed.";
        }
    

  

输出：

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