Class CKEDITOR.dom.element
Extends
CKEDITOR.dom.node.
Defined in: core/dom/element.js.
Constructor Attributes | Constructor Name and Description |
---|---|
CKEDITOR.dom.element(element, ownerDocument)
Represents a DOM element.
|
Field Attributes | Field Name and Description |
---|---|
The native DOM element represented by this class instance.
|
Method Attributes | Method Name and Description |
---|---|
<static> |
CKEDITOR.dom.element.createFromHtml(html, ownerDocument)
Creates an instance of the CKEDITOR.dom.element class based on the
HTML representation of an element.
|
addClass(className)
Adds a CSS class to the element.
|
|
append(node)
Append a node as a child of this element.
|
|
appendText(text)
Append text to this element.
|
|
Gets the document containing this element.
|
|
getFirst()
Gets the first child node of this element.
|
|
getHtml()
Gets the inner HTML of this element.
|
|
getId()
Gets the value of the "id" attribute of this element.
|
|
getName()
Gets the element name (tag name).
|
|
Gets the value of the "name" attribute of this element.
|
|
hide()
Hides this element (display:none).
|
|
remove()
Removes the element from the document DOM.
|
|
removeAttribute(name)
Removes an attribute from the element.
|
|
removeClass(className)
Removes a CSS class name from the elements classes.
|
|
setAttribute(name, value)
Sets the value of an element attribute.
|
|
setAttributes(attributesPairs)
Sets the value of several element attributes.
|
|
setHtml(html)
Sets the inner HTML of this element.
|
|
setStyle(name, value)
Sets the value of an element style.
|
|
setStyles(stylesPairs)
Sets the value of several element styles.
|
|
setText(text)
Sets the element contents as plain text.
|
|
show()
Shows this element (display it).
|
- Methods borrowed from class CKEDITOR.dom.node:
- appendTo, insertAfter, insertBefore
Class Detail
CKEDITOR.dom.element(element, ownerDocument)
Since:
3.0
Represents a DOM element.
// Create a new <span> element. var element = new CKEDITOR.dom.element( 'span' );
// Create an element based on a native DOM element. var element = new CKEDITOR.dom.element( document.getElementById( 'myId' ) );
- Parameters:
- {Object|String} element
- A native DOM element or the element name for new elements.
- {CKEDITOR.dom.document} ownerDocument Optional
- The document that will contain the element in case of element creation.
Field Detail
{Object}
$
Since:
3.0
The native DOM element represented by this class instance.
var element = new CKEDITOR.dom.element( 'span' ); alert( element.$.nodeType ); // "1"
Method Detail
<static>
{CKEDITOR.dom.element}
CKEDITOR.dom.element.createFromHtml(html, ownerDocument)
Since:
3.0
Creates an instance of the CKEDITOR.dom.element class based on the
HTML representation of an element.
var element = CKEDITOR.dom.element.createFromHtml( '<strong class="anyclass">My element</strong>' ); alert( element.getName() ); // "strong"
- Parameters:
- {String} html
- The element HTML. It should define only one element in the "root" level. The "root" element can have child nodes, but not siblings.
- ownerDocument
- Returns:
- {CKEDITOR.dom.element} The element instance.
{Undefined}
addClass(className)
Since:
3.0
Adds a CSS class to the element. It appends the class to the
already existing names.
var element = new CKEDITOR.dom.element( 'div' ); element.addClass( 'classA' ); // <div class="classA"> element.addClass( 'classB' ); // <div class="classA classB"> element.addClass( 'classA' ); // <div class="classA classB">
- Parameters:
- {String} className
- The name of the class to be added.
{CKEDITOR.dom.node}
append(node)
Since:
3.0
Append a node as a child of this element.
var p = new CKEDITOR.dom.element( 'p' ); var strong = new CKEDITOR.dom.element( 'strong' ); p.append( strong ); var em = p.append( 'em' ); // result: "<p><strong></strong><em></em></p>"
- Parameters:
- {CKEDITOR.dom.node|String} node
- The node or element name to be appended.
- Returns:
- {CKEDITOR.dom.node} The appended node.
{CKEDITOR.dom.node}
appendText(text)
Since:
3.0
Append text to this element.
var p = new CKEDITOR.dom.element( 'p' ); p.appendText( 'This is' ); p.appendText( ' some text' ); // result: "<p>This is some text</p>"
- Parameters:
- {String} text
- The text to be appended.
- Returns:
- {CKEDITOR.dom.node} The appended node.
{CKEDITOR.dom.document}
getDocument()
Since:
3.0
Gets the document containing this element.
var element = CKEDITOR.document.getById( 'example' ); alert( element.getDocument().equals( CKEDITOR.document ) ); // "true"
- Returns:
- {CKEDITOR.dom.document} The document.
{CKEDITOR.dom.node}
getFirst()
Since:
3.0
Gets the first child node of this element.
var element = CKEDITOR.dom.element.createFromHtml( '<div><b>Example</b></div>' ); var first = element.getFirst(); alert( first.getName() ); // "b"
- Returns:
- {CKEDITOR.dom.node} The first child node or null if not available.
{String}
getHtml()
Since:
3.0
Gets the inner HTML of this element.
var element = CKEDITOR.dom.element.createFromHtml( '<div><b>Example</b></div>' ); alert( p.getHtml() ); // "<b>Example</b>"
- Returns:
- {String} The inner HTML of this element.
{String}
getId()
Since:
3.0
Gets the value of the "id" attribute of this element.
var element = CKEDITOR.dom.element.createFromHtml( '<p id="myId"></p>' ); alert( element.getId() ); // "myId"
- Returns:
- {String} The element id, or null if not available.
{String}
getName()
Since:
3.0
Gets the element name (tag name). The returned name is guaranteed to
be always full lowercased.
var element = new CKEDITOR.dom.element( 'span' ); alert( element.getName() ); // "span"
- Returns:
- {String} The element name.
{String}
getNameAtt()
Since:
3.0
Gets the value of the "name" attribute of this element.
var element = CKEDITOR.dom.element.createFromHtml( '<input name="myName"></input>' ); alert( element.getNameAtt() ); // "myName"
- Returns:
- {String} The element name, or null if not available.
{Undefined}
hide()
Since:
3.0
Hides this element (display:none).
var element = CKEDITOR.dom.element.getById( 'myElement' ); element.hide();
{Undefined}
remove()
Since:
3.0
Removes the element from the document DOM.
var element = CKEDITOR.dom.element.getById( 'MyElement' ); element.remove();
{Undefined}
removeAttribute(name)
Since:
3.0
Removes an attribute from the element.
var element = CKEDITOR.dom.element.createFromHtml( '' ); element.removeAttribute( 'class' );
- Parameters:
- {String} name
- The attribute name.
{Undefined}
removeClass(className)
Since:
3.0
Removes a CSS class name from the elements classes. Other classes
remain untouched.
var element = new CKEDITOR.dom.element( 'div' ); element.addClass( 'classA' ); // <div class="classA"> element.addClass( 'classB' ); // <div class="classA classB"> element.removeClass( 'classA' ); // <div class="classB"> element.removeClass( 'classB' ); // <div>
- Parameters:
- {String} className
- The name of the class to remove.
{Undefined}
setAttribute(name, value)
Since:
3.0
Sets the value of an element attribute.
var element = CKEDITOR.dom.element.getById( 'myElement' ); element.setAttribute( 'class', 'myClass' ); element.setAttribute( 'title', 'This is an example' );
- Parameters:
- {String} name
- The name of the attribute.
- {String} value
- The value to be set to the attribute.
{Undefined}
setAttributes(attributesPairs)
Since:
3.0
Sets the value of several element attributes.
var element = CKEDITOR.dom.element.getById( 'myElement' ); element.setAttributes({ 'class' : 'myClass', 'title' : 'This is an example' });
- Parameters:
- {Object} attributesPairs
- An object containing the names and values of the attributes.
{String}
setHtml(html)
Since:
3.0
Sets the inner HTML of this element.
var p = new CKEDITOR.dom.element( 'p' ); p.setHtml( '<b>Inner</b> HTML' ); // result: "<p><b>Inner</b> HTML</p>"
- Parameters:
- {String} html
- The HTML to be set for this element.
- Returns:
- {String} The inserted HTML.
{Undefined}
setStyle(name, value)
Since:
3.0
Sets the value of an element style.
var element = CKEDITOR.dom.element.getById( 'myElement' ); element.setStyle( 'background-color', '#ff0000' ); element.setStyle( 'margin-top', '10px' ); element.setStyle( 'float', 'right' );
- Parameters:
- {String} name
- The name of the style. The CSS naming notation must be used (e.g. "background-color").
- {String} value
- The value to be set to the style.
{Undefined}
setStyles(stylesPairs)
Since:
3.0
Sets the value of several element styles.
var element = CKEDITOR.dom.element.getById( 'myElement' ); element.setStyles({ 'position' : 'absolute', 'float' : 'right' });
- Parameters:
- {Object} stylesPairs
- An object containing the names and values of the styles.
{String}
setText(text)
Since:
3.0
Sets the element contents as plain text.
var element = new CKEDITOR.dom.element( 'div' ); element.setText( 'A > B & C < D' ); alert( element.innerHTML ); // "A > B & C < D"
- Parameters:
- {String} text
- The text to be set.
- Returns:
- {String} The inserted text.
{Undefined}
show()
Since:
3.0
Shows this element (display it).
var element = CKEDITOR.dom.element.getById( 'myElement' ); element.show();