DOM Element Functions

© 2012, Martin Rinehart

create_attached_element()

host_object = create_attached_element(
        parent, type, id, style_specs, other_specs );

parent (mandatory) DOM parent element

See create_element() for other parameters.

Creates, attaches to the DOM and returns a DOM element.

create_element()

host_object = create_element(
        type, id, style_specs, other_specs );

type (mandatory) The type of DOM element, e.g. 'div'.

Optional arguments:

Creates and returns a new DOM element.

detach_element()

detach_element( unwanted_element );

Recursively detaches child (grandchild, etc.) elements and then detaches the element itself from the DOM. Needed to prevent MSIE memory leaks.

detach_element_by_id()

detach_element_by_id( id );

The id is a string used by document.getElementById().

edit_add_styles()

/* edit and/or add styles */ edit_add_styles( element, new_styles);

Edits existing and/or adds new styles to an element.

fixup_event()

standard_event = fixup_event( event );

Raises window.event up to function argument (for MSIE) and copies event.srcElement into event.target (also for MSIE) to create a standards-defined event.

WARNING: This function modifies the event object, which is a host object. Modifying host objects is, at best, a dangerous practice. A better practice is to use a wrapper event. However, this one has been in use for a long time and shows no visible bad habits. One hopes that Microsoft will not be so perverse as to use "event.target" for some non-standards compliant purpose.

get_size()

{width: w, height: h} = get_size( dom_element );

Returns size object from getBoundingClientRect().

has_vscroll()

boolean = has_vscroll( element );

WARNING: This function was hanged by the neck until dead. It's crime? Gross unreliability. We are currently looking for volunteers for this very dangerous mission.

insert_after()

insert_after( new_elem, existing_elem );

Insert new element after existing element. (Included here because W3C only specifies insertBefore().)

nodelist2array()

array = nodelist2array( nodelist );

Converts nodelist from a pseudo array to a real Array. Note: the nodelist is a dynamic object, reflecting changes in the underlying DOM. The array is static, not changing after it is created.

number_from_style_px()

number = number_from_style_px( "300px" );

Returns 300 from '300px'. Also returns 5 from "solid 5px #a0a0ff".

say_center()

div = say_center( parent, text );
div = say_center( parent, text, styles );

Centers (horizontal center) text "in" parent element. Creates a new DOM div and appends it to the parent element. Inserts the text as the innerHTML property of the new div. Applies the styles (see the styles object page), if any, to the new div and returns a reference to the div.

If not specified otherwise in the styles object, the new div's display is inline-block and its position is absolute. This means that the text may be entirely outside the parent element. For example, this routine is used to attach text labels below tic mark "parent" elements in a horizontal meter.

say_middle()

div = say_center( parent, text );
div = say_middle( parent, text, styles );

Centers (vertical center) text "in" parent element. Creates a new DOM div and appends it to the parent element. Inserts the text as the innerHTML property of the new div. Applies the styles (see the styles object page), if any, to the new div and returns a reference to the div.

If not specified otherwise in the styles object, the new div's display is inline-block, its position is absolute and its bottomPadding is 2px. This means that the text may be entirely outside the parent element. For example, this routine is used to attach text labels beside tic mark "parent" elements in a vertical meter.

style_an_element()

style_an_element( element, styles );

Adds the styles (see the Styles Object page) to the DOM element's style property.

Style given styles object(s).

style_elements()

style_elements( elements_array, styles );

The elements_array is an array of references to DOM elements. This function calls the style_an_element() function for each element in the array. This is used to apply the same styles (see the Styles Object page) to several elements.


Feedback: MartinRinehart at gmail dot com

# # #