CKEditor Ecosystem Documentation
Search
Report an issue
Home/CKEditor 4/API
Class

CKEDITOR.htmlWriter

class
See source

The class used to write HTML data.

var writer = new CKEDITOR.htmlWriter();
writer.openTag( 'p' );
writer.attribute( 'class', 'MyClass' );
writer.openTagClose( 'p' );
writer.text( 'Hello' );
writer.closeTag( 'p' );
alert( writer.getHtml() ); // '<p class="MyClass">Hello</p>'

Filtering

Properties

  • indentationChars : String

    See source

    The characters to be used for each indentation step.

    // Use tab for indentation.
editorInstance.dataProcessor.writer.indentationChars = '\t';

    Defaults to '\t'

  • lineBreakChars : String

    See source

    The characters to be used for line breaks.

    // Use CRLF for line breaks.
editorInstance.dataProcessor.writer.lineBreakChars = '\r\n';

    Defaults to '\n'

  • selfClosingEnd : String

    See source

    The characters to be used to close "self-closing" elements, like <br> or <img>.

    // Use HTML4 notation for self-closing elements.
editorInstance.dataProcessor.writer.selfClosingEnd = '>';

    Defaults to ' />'

Methods

  • inherited

    constructor() → basicWriter

    See source

    Creates a basicWriter class instance.

    Returns

    basicWriter

  • inherited

    attribute( attName, attValue )

    See source

    Writes an attribute. This function should be called after opening the tag with openTagClose.

    // Writes ' class="MyClass"'.
writer.attribute( 'class', 'MyClass' );

    Parameters

    attName : String

    The attribute name.

    attValue : String

    The attribute value.

  • inherited

    closeTag( tagName )

    See source

    Writes a closer tag.

    // Writes '</p>'.
writer.closeTag( 'p' );

    Parameters

    tagName : String

    The element name for this tag.

  • inherited

    comment( comment )

    See source

    Writes a comment.

    // Writes '<!-- My comment -->'.
writer.comment( ' My comment ' );

    Parameters

    comment : String

    The comment text.

  • inherited

    getHtml( reset ) → String

    See source

    Empties the current output buffer.

    var html = writer.getHtml();

    Parameters

    reset : Boolean

    Indicates that the reset method is to be automatically called after retrieving the HTML.

    Returns

    String

    The HTML written to the writer so far.

  • indentation()

    See source

    Writes the current indentation character. It uses the indentationChars property, repeating it for the current indentation steps.

    // Writes '\t' (e.g.).
writer.indentation();

  • lineBreak()

    See source

    Writes a line break. It uses the lineBreakChars property for it.

    // Writes '\n' (e.g.).
writer.lineBreak();

  • inherited

    openTag( tagName, attributes )

    See source

    Writes the tag opening part for a opener tag.

    // Writes '<p'.
writer.openTag( 'p', { class : 'MyClass', id : 'MyId' } );

    Parameters

    tagName : String

    The element name for this tag.

    attributes : Object

    The attributes defined for this tag. The attributes could be used to inspect the tag.

  • inherited

    openTagClose( tagName, isSelfClose )

    See source

    Writes the tag closing part for a opener tag.

    // Writes '>'.
writer.openTagClose( 'p', false );

// Writes ' />'.
writer.openTagClose( 'br', true );

    Parameters

    tagName : String

    The element name for this tag.

    isSelfClose : Boolean

    Indicates that this is a self-closing tag, like <br> or <img>.

  • inherited

    reset()

    See source

    Empties the current output buffer.

    writer.reset();

  • setRules( tagName, rules )

    See source

    Sets formatting rules for a given element. Possible rules are:

    • indent – indent the element content.
    • breakBeforeOpen – break line before the opener tag for this element.
    • breakAfterOpen – break line after the opener tag for this element.
    • breakBeforeClose – break line before the closer tag for this element.
    • breakAfterClose – break line after the closer tag for this element.

    All rules default to false. Each function call overrides rules that are already present, leaving the undefined ones untouched.

    By default, all elements available in the CKEDITOR.dtd.$block, CKEDITOR.dtd.$listItem, and CKEDITOR.dtd.$tableContent lists have all the above rules set to true. Additionaly, the <br> element has the breakAfterOpen rule set to true.

    // Break line before and after "img" tags.
writer.setRules( 'img', {
    breakBeforeOpen: true
    breakAfterOpen: true
} );

// Reset the rules for the "h1" tag.
writer.setRules( 'h1', {} );

    Parameters

    tagName : String

    The name of the element for which the rules are set.

    rules : Object

    An object containing the element rules.

  • inherited

    text( text )

    See source

    Writes text.

    // Writes 'Hello Word'.
writer.text( 'Hello Word' );

    Parameters

    text : String

    The text value.

  • inherited

    write( data )

    See source

    Writes any kind of data to the ouput.

    writer.write( 'This is an <b>example</b>.' );

    Parameters

    data : String