The first parameter of all functions is element, which indicates the reference of the Element to be operated. extend, add these methods to the DOM object, using the methodize function. You do not need to enter the first parameter during the call, for example:
Var B = $('div1 '). visible ();
In addition, almost all functions return to themselves. Note that the extended element type is HTMLElement. The advantage of doing so is that code can be easily written, for example:
$ ('Did1'). update (). insert ('this is the newly inserted content ');
Writing code in this way has the advantages of strong readability and ease of writing.
The following describes the functions:
Visible (element): Boolean
Whether the element is visible (depending on element. style. display)
Toggle (element): HTMLElement
If the element is visible, it is invisible. If the element is invisible, it is visible. Returns the reference of the element. (Depending on element. style. display)
Hide (element): HTMLElement
Hide elements. (Depending on element. style. display)
Show (element): HTMLElement
Display element. (Depending on element. style. display)
Remove (element): HTMLElement
Delete the element itself (the deleted element is returned after deletion ).
Update (element, content): HTMLElement
Similar to element. innerHTML, the processing script function is added. It inserts the content first and then executes the script in the content.
Replace (element, content): HTMLElement
Replace the current element. And return the replaced element.
Insert (element, insertions): HTMLElement
Insert content at the specified position of the element. The value of insertions is as follows:
String/number/element, for example, 'This is the string to insert !! ', Inserted to the bottom position of the element by default.
{Top: xxxxx, bottom: yyyy, before: zzzzz, after: aaaa}, for example: {top: 'This the content you will insert! '}.
The returned value is element.
Wrap (element, wrapper, attributes): HTMLElement
Add an element outside the element. It is usually used as a mask.
Wrapper: elementId, element, tagName, attrbutes (label setting can be omitted when the created cover is div)
Attributes: a json object used to set the style of an element, such as: {color: "red", backgroundImage: "url(header.gif )"}
$ ('Win1'). wrap ('did1', {color: "#666 "});
$ ('Win1'). wrap ('span ', {font-size: 12 });
$ ('Win1'). wrap ({color: "#666 "});
Returns the reference of the created mask.
Inspect (element): string
Generate a string that represents the current element. For example, <div id = 'xxx' class = 'xxx'> has only two attributes, not equal to toHTML ().
RecursivelyCollect (element, property): HTMLElement []
Poor description, such as $('div1 '). recursivelyCollect ('firstchild'), which returns all elements in div1 that are the eldest son.
Ancestors (element): HTMLElement []
Returns all sequence ancestor of this element. For example, if div1 is an element, its father is div2 and div2, and its father is div3, it is called continuously.
Descendants (element): HTMLElement []
Returns an array of all child element nodes. Equal to element. select ('*').
FirstDescendant (element): HTMLElement
Returns the first son. All sons (not including grandsons, grandsons ...... Oh ).
ImmediateDescendants (element): HTMLElement []
Return to all sons (excluding grandsons, grandsons, and grandsons ...... Oh ).
Previussiblings (element): HTMLElement []
Return to all brothers.
NextSiblings (element): HTMLElement []
Return to all younger siblings.
Siblings (element): HTMLElement []
Return all the brothers and sort them in the order of "appear in html.
Match (element, selector): Boolean
Whether the element meets the specified selection character
Up (element, expression, index): HTMLElement
In element. ancestors (), the index element in the array that meets the expression is as follows:
$('Div1 '). up ('div', 1) returns a reference to the element whose label is div and serial number is 1 in the direct ancestor.
Down (element, expression, index): HTMLElement
Returns the element whose nth index matches the expression.
Previous (element, expression, index): HTMLElement
Previous (element, expression, index): HTMLElement
There is no suspense between the two. The first, the last, the first, and the last are returned.
Select (element, selector1, selector2 ,......) : HTMLElement []
Returns an array of elements that match the selector. Multiple selector elements are in the Union relationship.
Adjacent (element, selector): HTMLElement []
Return all the brothers that meet the selection character, not including themselves.
Identify (element): string
If there is an id, an existing id is returned. If there is no id, an id is returned. And return.
ReadAttribute (element, name): string
Read attributes
WriteAttribute (element, name, value): HTMLElement
Write attribute
========================================================== =====
The above functions are used for queries and chores. The following functions are generally used to obtain and set various coordinates. On a webpage, there are several common coordinates of an element, but they are as follows:
1. Relative to
2. Relative to
3. Relative to an element
Looking at the code in each framework, there are three types of coordinates. The following is a brief description.
GetHeight (element) and getWidth (element) are equivalent to clientHeight and clientWidth.
ClassNames (element): Element. ClassNames
HasClassName (element, className): Boolean
AddClassName (element, className): HTMLElement
RemoveClassName (element, className): HTMLElement
ToggleClassName (element, className): HTMLElement
CleanWhitespace (element): HTMLElement, delete blank text nodes
Empty (element): Boolean, whether the element content is blank
DescendantOf (element, ancestor): Boolean, used to determine whether an element is a descendant of an element. ancestor is an id or element reference.
ScrollTo (element): HTMLElement. Scroll to this element and return a reference to this element.
GetStyle (element, style): returns the value of an identical expression of an element with an indefinite type.
GetOpacity (element): Float, returns transparency.
SetStyle (element, styles): HTMLElement, which sets the style of an element. styles is a JSON object.
SetOpacity (element, value): HTMLElement, set the transparency of the element.
GetDimensions (element): {width: x, height: y }. Return clientWidth and clientHeight.
MakePositioned (element): HTMLElement. Set position to relative. Do not set the location to the current location.
UndoPositioned (element): HTMLElement, which sets the position of an element to the default value.
Makateping (element): HTMLElement, used to set element overflow.
UndoClipping (element): HTMLElement, clear overflow.
CumulativeOffset (element): Element. _ returnOffset to obtain the offset relative to the entire page.
PositionedOffset (element): Element. _ returnOffset. Get the element offset that is not static relative to the first position. If both are static, it is relative to the page.
Absolutize (element): HTMLElement, which sets the position to absolute, and sets the position to the current position.
Relativize (element): HTMLElement, which sets the position to ralative, and sets the position to the current position.
Cumulativescroloffset (element): Element. _ returnOffset. The sum of scroloffset relative to the top-level container is not necessarily a document, because iframe is not included in the page.
GetOffsetParent (element): HTMLElement. If you have studied css, you can just say that you don't need to say more.
ViewportOffset (element): Element. _ returnOffset, returns the offset relative to the upper left corner of the area.
ClonePosition (element, source): HTMLElement, from the source clone location attribute to itself.
