Skip to main content
Home  › ... 2sxc Apps

Razor Blade Tutorials

Tutorial Home
Use Scrub to Remove All or Specific HTML Tags
#3 Use Scrub to remove Tag-Attributes, Classes, Styles or whatever you need
Page Title, Keyword, Description

RazorBlade IScrub.Attributes(...), IScrub.Styles(), IScrub.Classes()

These demos show how to scrub attributes of html source.
Requirements
Resources

Info about the Base Class

This tutorial inherits from the Custom.Hybrid.Razor14 base class.

This allows us to use Kit.Scrub to access IScrub without having to use GetService<>

Scrub classes

Using IScrub.Classes(source) you can scrub all classes.
Scrub all classes from source: <div ><strong >No</strong> classes allowed</div>
 

@{
  var exampleClasses = "<div class='remove-me not-allowed'><strong class='not-allowed'>No</strong> classes allowed</div>";
}
<div><strong>Scrub all classes from source: </strong><code>@Kit.Scrub.Classes(exampleClasses)</code></div>

Scrub attributes

Using IScrub.Attributes(source, attributes) you can scrub attributes.
Scrub all attributes from source: <div>No attributes allowed</div>
Scrub one attribute from source: <div not-allowed class='removed'>No attributes allowed</div>
Scrub some attributes from source: <div class='removed'>No attributes allowed</div>
 

@{
  var exampleAttributes = "<div remove-me not-allowed class='removed'>No attributes allowed</div>";
}
<div><strong>Scrub all attributes from source: </strong><code>@Kit.Scrub.Attributes(exampleAttributes)</code></div>
<div><strong>Scrub one attribute from source: </strong><code>@Kit.Scrub.Attributes(exampleAttributes, "remove-me")</code></div>
<div><strong>Scrub some attributes from source: </strong><code>@Kit.Scrub.Attributes(exampleAttributes, new string[] { "remove-me", "not-allowed" })</code></div>

Scrub styles

Using IScrub.Styles(source) you can scrub all styles.
Scrub all styles from source: <div >No styles allowed</div>
 

@{
  var exampleStyle = "<div style='background-color: red; width: 50px; height: 50px;'>No styles allowed</div>";
}
<div><strong>Scrub all styles from source: </strong><code>@Kit.Scrub.Styles(exampleStyle)</code></div>
Use Scrub to Remove All or Specific HTML Tags
#3 Use Scrub to remove Tag-Attributes, Classes, Styles or whatever you need
Page Title, Keyword, Description

Source Code of this file

Below you'll see the source code of the file. Note that we're just showing the main part, and hiding some parts of the file which are not relevant for understanding the essentials. Click to expand the code 

@inherits Custom.Hybrid.Razor14
@using ToSic.Razor.Blade;
<!-- unimportant stuff, hidden -->
<div class="row">
  <div class="col-md-7">
    RazorBlade IScrub.Attributes(...)... <!-- unimportant stuff, hidden -->
  </div>
  @Html.Partial("../shared/_DefaultInfoSection.cshtml")
</div>

@Html.Partial("../shared/_KitBaseClassInfoBox.cshtml", new { ServiceName = "Scrub", Service = "IScrub" })

Scrub classes Using... <!-- unimportant stuff, hidden -->

@{
  var exampleClasses = "<div class='remove-me not-allowed'><strong class='not-allowed'>No</strong> classes allowed</div>";
}
<div><strong>Scrub all classes from source: </strong><code>@Kit.Scrub.Classes(exampleClasses)</code></div>



Scrub attributes Using... <!-- unimportant stuff, hidden -->

@{
  var exampleAttributes = "<div remove-me not-allowed class='removed'>No attributes allowed</div>";
}
<div><strong>Scrub all attributes from source: </strong><code>@Kit.Scrub.Attributes(exampleAttributes)</code></div>
<div><strong>Scrub one attribute from source: </strong><code>@Kit.Scrub.Attributes(exampleAttributes, "remove-me")</code></div>
<div><strong>Scrub some attributes from source: </strong><code>@Kit.Scrub.Attributes(exampleAttributes, new string[] { "remove-me", "not-allowed" })</code></div>



Scrub styles Using IScrub.Styles(source)... <!-- unimportant stuff, hidden -->

@{
  var exampleStyle = "<div style='background-color: red; width: 50px; height: 50px;'>No styles allowed</div>";
}
<div><strong>Scrub all styles from source: </strong><code>@Kit.Scrub.Styles(exampleStyle)</code></div>



<!-- unimportant stuff, hidden -->