Editing a Document

As we already mentioned here the implementation of HTMLDocument as well as the whole DOM are based on WHATWG DOM standard. So, it is easy to use Aspose.HTML having a basic knowledge of HTML and JavaScript languages. The DOM namespace is represented with the following fundamental data types:

Data type Description
DocumentThe Document represents the entire HTML, XML or SVG document. Conceptually, it is the root of the document tree and provides the primary access to the document’s data.
EventTargetThe EventTarget interface is implemented by all Nodes in an implementation that supports the DOM Event Model.
NodeThe Node is the primary datatype for the entire Document Object Model. It represents a single node in the document tree.
ElementThe element type is based on node and represents a base class for HTMLXML or SVG DOM.
AttributeThe Attr interface represents an attribute in an Element object. Typically the allowable values for the attribute are defined in a schema associated with the document.

The following is a brief list of useful API methods provides by the core data types:

Method Description
document.getElementById(elementId) The method, when invoked, must return the first element whose ID is elementId and null if there is no such element otherwise.
document.getElementsByTagName(name) The method must return the list of elements with the given name.
document.createElement(tagName)The method creates the HTML element specified by tagName, or an HTMLUnknownElement if tagName isn’t recognized.
parentNode.appendChild(node)The method adds a node to the end of the list of children of a specified parent node.
element.setAttribute(name, value)Sets the value of an attribute on the specified element.
element.getAttribute(name)The method returns the value of a specified attribute on the element.
element.innerHTML Returns a fragment of markup contained within the element.

For a complete list of interfaces and methods represented in the DOM namespace please visit API Reference Source.

Edit HTML

There are many ways you can edit HTML by using our library. You can modify the document by inserting new nodes, removing, or editing the content of existing nodes. If you need to create a new node, the following methods are ones that need to be invoked:

Method Description 
document.CreateCDATASection(data) Creates a CDATASection node whose value is the specified string. 
document.CreateComment(data) Creates a Comment node given the specified string. 
document.CreateDocumentFragment() Creates an empty DocumentFragment object. 
document.CreateElement(localName) Creates an element of the type specified. 
document.CreateEntityReference(name) Creates an EntityReference object. 
document.CreateProcessingInstruction(target, data) Creates an ProcessingInstruction with the specified name and data. 
document.CreateTextNode(data) Creates a Text node given the specified string. 

Once you have new nodes are created, there are several methods in DOM that can help you to insert nodes into the tree. The following list describes the most common way of inserting nodes: 

Method Description 
node.InsertBefore(node, child) Inserts the node before the reference child node
node.AppendChild(node) Adds the node to the list of children of the current node 
To remove a node from the HTML DOM tree, please use the RemoveChild(child) or Remove() methods.

The following is a code snippet how to edit HTML document using the mentioned above functional:

Using InnerHTML & OuterHTML attributes

Having DOM objects gives you a powerful tool to manipulate with an HTML Document. However, sometime much better to work just with System.String. The following code snippet shows you how to use InnerHTML & OuterHTML properties to edit HTML.

Edit CSS

Cascading Style Sheets (CSS) is a style sheet language used for describing how webpages look in the browser. Aspose.HTML not only support CSS out-of-the-box but also gives you instruments to manipulate with document styles just on the fly before converting the HTML document to the other formats, as it follows: