jquery Property Operations

The previous section describes how to find element nodes, which describe property operations that are found after a node. Includes (set, read, delete, modify) element attribute values, and discusses them from the DOM and jquery two aspects.

1 setting elements

In the DOM

Setting properties

SetAttribute (Name,value)

Accessing properties

GETATTRIBUTR (name) returns the property value of the specified property

Setting property access Properties in jquery is all in the following two functions

Setting properties

Prop (Prpertname,value,function)

attr (IBID.) (this method is not allowed in Internet Explorer to change the Type property of <input><button>.) ）

The difference between the two functions, Ah, attr () function when accessing the Chechbox disable property, there are some problems, so the prop method is introduced, the choice of the general prop when the property value is True/false.

Accessing properties

Only the first parameter is passed, the property value of the property is returned, only the first matching element is obtained, and each () traversal can be used.

(W3 form specification, checked is a Boolean property, use Prop ("checked") to return a Boolean value, use attr (' checked ') to return to checked, use prop when detecting whether a form is selected, true/false using Prop.

2 Deleting attributes

Use RemoveAttribute (name) in DOM

jquery Packaging Prop (), Removeprop () is primarily used to remove prop set of properties

Removeattr () uses native Dom RemoveAttribute () The advantage of this method can be called directly by the jquery object access, and has good browser compatibility, using the Removeprop () method for special attributes

Class 3 Operations

There is no specific method of operation in the DOM

In jquery

AddClass (classname)

1 He can add multiple attributes ($ ("P"). addclass (' Class1 class2 ');

2 The method does not replace the style, but simply adds

Removeclass (classname) Deletes the element, or it can delete more than one element, with no parameters passed in to delete all.

Toggle class Style

The Toggleclass (classname,switch,fuction ()) switch is used to determine whether the element is added or removed.

Judging style

Hasattribute () The method will be wrapped. Used to determine whether a style exists

3 Read and write text and values

"HTML"

The DOM defines the innerHTML attribute for each element, which overrides the HTML that it contains.

Jquery

HTML ()

HTML (htmlstring)

HTML (function (index,html))

(All HTML under the node will be read when the method has no parameters, and HTML will be inserted into the specified node when there are parameters, overwriting itself)

"text"

There is a serious compatibility problem innertext this property in the DOM

Jquery

Text ()

Text (htmlstring)

Text (function (index,html))

(the latter is text)

"Value"

The value is a special text string that is primarily set in the form Value,javascript the direct call to the Value property exists for compatibility issues

Jquery

Val ()

Val (htmlstring)

Val (function (index,html))

(Nothing good to introduce, mainly used in the prompt output text box: if ($ (this). val== "" {$ (this), val= please enter text}))

4 Style sheet actions

1 read/write CCS style (CCS style: In-line document, internal document, external document)

Direct definition of Style object in JavaScript gets inline style (cannot get other styles)

Read and write CCS stylesheets, you can use the StyleSheets object implementation of the Document object, the DOM also defines a Cssrules collection for each style sheet, but the IE browser defines the rules collection to support operation-compatible code

{var cssrules=document.stylesheets[0].cssrules| | Document.stylesheets[0].rules}

Writing styles to style sheets

Ccsrules[0].style.fontweigh= "Bold"

Insertrule (' p{background-color=red} ', n);

AddRule ("P", "background-color=red", n); I ie conversion method

jquery defines the CCS () method

CCS (name)

CCS (Name,value)

CCS (function (index,html))

One parameter returns the CCS style, 2 parameters add the CCS style, you can add more than one style example: $ ("P"). CCS (color: "Red", Fontweigt: "bold");

Absolute positioning and relative positioning

Absolute positioning

jquery wraps the offsetparent () in the DOM, omitting the iterative process to get the offset () method

Offset ()

Offset (coordomates)

Offset (function (index,coords))

1 coordomates indicates that an object contains a Left,top property

2 Call the method does not pass arguments, it returns an object that contains the left and top properties, which are valid only for visible elements

Relative positioning

(ie is positioned to calculate the parent element border while the rest is not)

Position () The method call automatically needs to find the nearest parent element and the parent element postion:relative

Set Box size

Width ()

Height () (default unit PX, need to be passed in as a string when adding units)

Read object size without parameters, change object size with parameters

jquery Property Operations