CSS in jquery (ii)

One: Get styles and set styles

4. Remove the style:

5. Toggle Style

6. Determine if a style is included

Two: Set or get HTML, text, and values

HTML () Gets the HTML content of the first matching element. This function cannot be used with XML documents. But it can be used in XHTML documents.   Return value string example HTML code: <div><p>hello</p></div>jquery Code: $ ("div"). html (); result:<p> Hello</p> html (val) sets the HTML content for each matching element. This function cannot be used with XML documents. But it can be used in XHTML documents. The value of the JQuery parameter Val (String): The value for setting HTML content sample HTML code: <div></div>jquery Code: $ ("div"). html ("<p>hello Again </p> "); result: [<div><p>hello again</p></div>]  text () obtains the contents of all matching elements. The result is text that is combined with the text content contained by all matching elements. This method is valid for both HTML and XML documents. Return value string example HTML code:<p><b>test</b> paragraph.</p><p>paraparagraph</p>jquery code : $ ("P"). text (); Result: Test Paragraph.paraparagraph  text (val) sets the textual content of all matching elements to be similar to HTML (), but encodes HTML ("<" and " > Replace with the corresponding HTML entity. Return value JQuery parameter val (String): Text sample HTML code for setting element content: <p>test paragraph.</p>jquery Code: $ ("P") . Text ("<b>Some</b> new text."); Results: [<p><b>Some</b> new text.</p>] val () Gets the current value of the first matching element. In JQuery 1.2, you can return the value of any element. including SElect. If multiple selections, an array is returned that contains the selected value. The   return value String,array example obtains the value of a single select and the value of a multi-select Select. HTML Code:<p></p><br/>
<select id= "single" >
<option>Single</option>
<option>Single2</option>
</select>
<select id= "multiple" multiple= "multiple" >
<optionselected= "Selected" >Multiple</option>
<option>Multiple2</option>
<optionselected= "Selected" >Multiple3</option>
</select> jQuery Code: $ ("P"). Append (
"<b>Single:</b>" +$ ("#single"). Val () +
"<b>Multiple:</b>" + $ ("#multiple"). Val (). Join (",")
); Result: [<p><b>single:</b>single<b>multiple:</b>multiple,multiple3</p>] Gets the value of the text box in the HTML code: <inputtype= "Text" value= "some text"/> jQuery code: $ ("input"). Val (); Result: Some text Val (val) Sets the value of each matching element. In jquery 1.2, this can also be assigned a value for the SELECT element to return the value of the JQuery parameter Val (String): The value to set. Example setting the value of the text box HTML code: <input type= "text"/>jquery Code: $ ("input"). val ("Hello world!"); Val (val) Check,select,radio can be used to assign a value to the return value of the jquery parameter Val (array<string>): for Check/select A value example that sets the value of a select and a multiple-select Select HTML Code: <select id= "single" >
<option>Single</option>
<option>Single2</option>
</select>
<select id= "multiple" multiple= "multiple" >
<option selected= "Selected" >Multiple</option>
<option>Multiple2</option>
<optionselected= "Selected" >Multiple3</option>
</select><br/>
<input type= "checkbox" value= "Check1"/>check1
<input type= "checkbox" value= "Check2"/>check2
<input type= "Radio" value= "Radio1"/>radio1
<input type= "Radio" value= "Radio2"/> Radio2 jQuery Code: $ ("#single"). Val ("Single2");
$ ("#multiple"). Val (["Multiple2", "Multiple3"]);
$ ("input"). Val (["Check2", "Radio1"]);
Three: Css-dom

1:css

The CSS (name) accesses the style attributes of the first matching element. The return value String parameter name (string): The property name to access example gets the value of the first paragraph of the color Style property. JQuery Code: $ ("P"). CSS ("color"); CSS (properties) sets a "name/value pair" object to the style attributes of all matching elements. This is the best way to set a large number of style attributes on all matching elements. Return value jquery parameter properties (MAP): Example of a name/value pair to set as a style property the font color for all paragraphs is set to red and the background is blue. jquery Code: $ ("P"). CSS ({color: "#ff0011", Background: "Blue"}), if the property name contains "-", you must use quotation marks: JQuery code: $ ("P"). css ({"Margin-left ":" 10px "," Background-color ":" Blue "}); CSS (name,value) sets the value of a style property in all matching elements. The number is automatically converted to a pixel value return value the jquery parameter name (value): Property name Value (String, number): The property value example sets all paragraph fonts to the red jquery Code: $ ("P"). CSS ("Color", "red");

2: Location

Offset () Gets the relative offset of the matching element at the current viewport. The returned object contains two shaping properties: Top and left. This method is valid only for visible elements. The return value Object{top,left} example gets the offset of the second paragraph HTML code: <p>hello</p><p>2nd paragraph</p>jquery code: var p = $ ("p: Last ");
var offset =p.offset ();
P.html ("Left:" + Offset.left + ", Top:" + offset.top); Results: <p>hello</p><p>left:0, top:35</p>

3: Wide Height

Height () Gets the altitude value (px) that is currently computed for the first matching element. After jquery 1.2 can be used to get the high return value of window and document the integer example gets the high jquery code for the first paragraph: $ ("P"). Height (); Gets the document's high jquery Code: $ (documents). Height (); Height (val) Sets the value of the CSS height (hidth) property for each matching element. If no units are explicitly specified (for example: EM or%), use PX. If no units are explicitly specified (for example: EM or%), use PX.  Return value the JQuery parameter Val (String, number): Sets the value of ' height ' in CSS to set the height of all paragraphs to 20:jquery code: $ ("P"). Height (20); Width () Gets the value (px) of the current calculation for the first matching element. After JQuery 1.2 can be used to get window and document wide return value The integer example gets the width of the first paragraph of the jquery Code: $ ("P"). width (); Gets the wide jquery code for the current window: $ (window). width (); Width (val) Sets the value of the CSS width property for each matching element. If no units are explicitly specified (for example: EM or%), use PX. Return value the JQuery parameter Val (String, number): Sets the property value of CSS ' width '} example sets the width of all paragraphs to 20:jquery code: $ ("P"). Width (20);

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
CSS in jquery (ii)