element

element

Element methods to make DOM accessibility easier

Element methods appear on Array.prototype for occassions when a DOM query via $ returns an Array of Elements

$("select.city").attr("Ottawa");

element.attr

Method

Gets or sets attributes of Element

@param  {Mixed}  obj   Element or Array of Elements or $ queries
@param  {String} name  Attribute name
@param  {Mixed}  value Attribute value
@return {Object} Element or Array of Elements

Prototype

Array.prototype.attr			Element.prototype.attr

Example

if ($("#checkBoxId").attr("checked")) {
	…
}

element.clear

Method

Clears an object's innerHTML, or resets it's state

@param {String} id  Element, or selector for an Element

Prototype

Array.prototype.clear			Element.prototype.clear

Events

beforeClear  Fires before clearing the Element
afterClear   Fires after clearing the Element

Example

$("#id").clear();

element.create

Method

Creates an Element in document.body or a target Element

An id is generated if not specified with args

@param  {String} type   Type of Element to create
@param  {Object} args   [Optional] Collection of properties to apply to the new element
@param  {Mixed}  target [Optional] Target object or element.id value to append to
@return {Object} Element that was created or undefined

Prototype

Array.prototype.after			Element.prototype.after
Array.prototype.append			Element.prototype.append
Array.prototype.before			Element.prototype.before
Array.prototype.create			Element.prototype.create
Array.prototype.prepend			Element.prototype.prepend

Events

beforeCreate  Fires with the new Element's ID
afterCreate   Fires with the new Element

Example

$("ul").append("li").html("Another item");

element.css

Method

Creates a CSS stylesheet in the View

@param  {String} content  CSS to put in a style tag
@return {Object} Element created or undefined

Example

$.css(".someClass { color: #555; }");

element.destroy

Method

Destroys an Element

@param  {Mixed} obj Element or Array of Elements or $ queries
@return {Mixed} Element, Array of Elements or undefined

Prototype

Array.prototype.destroy				Element.prototype.destroy

Events

beforeDestroy  Fires before the destroy starts
afterDestroy   Fires after the destroy ends

Example

$(".someClass").destroy();

element.disable

Method

Disables an Element

@param  {Mixed} obj Element or Array of Elements or $ queries
@return {Mixed} Element, Array of Elements or undefined

Prototype

Array.prototype.disable				Element.prototype.disable

Events

beforeDisable  Fires before the disable starts
afterDisable   Fires after the disable ends

Example

$(".someClass").disable();

element.enable

Method

Enables an Element

@param  {Mixed} obj Element or Array of Elements or $ queries
@return {Mixed} Element, Array of Elements or undefined

Prototype

Array.prototype.enable				Element.prototype.enable

Events

beforeEnable  Fires before the enable starts
afterEnable   Fires after the enable ends

Example

$(".someClass").enable();

element.hasClass

Method

Determines if obj has a specific CSS class

@param {Mixed} obj Element or Array of Elements or $ queries @param {String} klass CSS class to query @return {Mixed} Element, Array of Elements or undefined

Prototype

Array.prototype.hasClass			Element.prototype.hasClass

Example

if ($("#id").hasClass("someClass")) alert("it's got it");

element.hidden

Method

Returns a Boolean indidcating if the Object is hidden

@param  {Mixed} obj Element or $ query
@return {Mixed} Boolean indicating if Object is hidden

Prototype

Array.prototype.isHidden			Element.prototype.isHidden

Example

$("#id").isHidden();

element.hide

Method

Hides an Element if it's visible

@param  {Mixed} obj Element or Array of Elements or $ queries
@return {Mixed} Element, Array of Elements or undefined

Prototype

Array.prototype.hide				Element.prototype.hide

Events

beforeHide  Fires before the object is hidden
afterHide   Fires after the object is hidden

Example

var obj = $("#id");
if (!obj.isHidden()) obj.hide();

element.klass

Method

Adds or removes a CSS class

@param  {Mixed}   obj Element or Array of Elements or $ queries
@param  {String}  arg Class to add or remove (can be a wildcard)
@param  {Boolean} add Boolean to add or remove, defaults to true
@return {Mixed} Element or Array of Elements

Prototype

Array.prototype.addClass			Element.prototype.addClass
Array.prototype.removeClass			Element.prototype.removeClass

Example

$("#id").addClass("someClass");

element.position

Method

Finds the position of an element

@param  {Mixed} obj Element or $ query
@return {Object} Object {left: n, top: n}

Prototype

Array.prototype.position			Element.prototype.position

Example

var pos = $("#id").position();

element.prependChild

Method

Alias of el.create

element.show

Method

Shows an Element if it's invisible

@param  {Mixed} obj Element or Array of Elements or $ queries
@return {Mixed} Element, Array of Elements or undefined

Prototype

Array.prototype.show				Element.prototype.show

Events

beforeShow  Fires before the object is shown
afterShow   Fires after the object is shown

Example

var obj = $("#id");
if (obj.isHidden()) obj.show();

element.size

Method

Returns the size of the Object

@param obj {Mixed} Instance, Array of Instances of $() friendly ID
@return {Object} Size {x:, y:}, Array of sizes or undefined

Prototype

Array.prototype.size				Element.prototype.size

Example

$("#id").size();

element.update

Method

Updates an Element

@param  {Mixed}  obj  Element or Array of Elements or $ queries
@param  {Object} args Collection of properties
@return {Mixed} Element, Array of Elements or undefined

Prototype

Array.prototype.html				Element.prototype.html
Array.prototype.text				Element.prototype.text
Array.prototype.update				Element.prototype.update

Events

beforeUpdate  Fires before the update starts
afterUpdate   Fires after the update ends

Example

$("#id").html("New content");

element.val

Method

Gets or sets the value of Element

@param  {Mixed}  obj   Element or Array of Elements or $ queries
@param  {Mixed}  value [Optional] Value to set
@return {Object} Element or Array of Elements

Prototype

Array.prototype.val					Element.prototype.val

Example

var value = $("input[type='textarea'].name").val();