jquery gets and changes element attribute values

Source: Internet
Author: User


The property of the tag is called the element attribute, and the corresponding property of the DOM object in JS is called the DOM attribute. The DOM attribute name in JS is sometimes different from the original element property name.


1 2 //return element specify attribute value3 vartxt1_val=$ ("#txt1"). attr ("value");4 //Change DOM property value by the DOM property name of the element5$("#txt1"). attr ({value:"Txt1_value", ClassName:"Txt1_class" });6 //Change element property values by specifying element attributes7$("#txt1"). attr ("class","Txt1_class2");8 //Assign a value to the specified element property, return the value by the method that is bundled later9$("#txt1"). attr ("class",function(){Ten    return"TXT1_CLASS3"; One}) A //Remove the specified element property -$("#txt1"). Removeattr ("class"); -  the //To add a property value to the CSS class or class element attribute, you can add more than one space separated by the following CSS class action function can also fill in multiple CSS classes -$("#txt1"). AddClass ("Txt1_classtxt1_class2"); - //To determine if the CSS class is already available, and returns TRUE or false -$("#txt1"). Hasclass ("Txt1_classtxt1_class2"); + //Removes the specified CSS class, separated by a space, and removes all CSS classes of the element, if none specified -$("#txt1"). Removeclass ("Txt1_class"); + //To determine if there is a CSS class that has to be deleted, not just added A$("#txt1"). Toggleclass ("Txt1_class"); at //Add this CSS class according to the back of the return, false delete this CSS class -$("#txt1"). Toggleclass ("Txt1_class",false); -  - //Returns the specified CSS style value -$("#txt1"). CSS ("Color"); - //Assign multiple styles at once in$("#txt1"). CSS ({color:"#ff0011", Background:"Blue"}); - //Assign a specified style at once to$("#txt1"). CSS ("Color","Black"); +  - //Sets the height of the element, no value returns the height of the element in units of pixels the$("#txt1"). Height (25); * //sets the width of the element, no value returns the width of the element $$("#txt1"). Width (150);Panax Notoginseng //Gets the inner height of the element, excluding the border -$("#txt1").Innerheight(); the //Gets the inner width of the element, not including the widening +$("#txt1").innerwidth(); A //Gets the outer height of the element, including the border the$("#txt1").Outerheight(); + //Gets the outer width of the element, including the border -$("#txt1").Outerwidth(); $  $ //Gets the offset position of the element relative to the window, returns two values, a top value, a left value - vartxt1_offset=$ ("#txt1"). offset (); - var Top=txt1_offset.Top; the varLeft=txt1_offset.left; - //Returns relative offset position relative to parent element, returns two values a top, a leftWuyi vartxt1_position=$ ("#txt1"). Position (); the var Top=txt1_position.Top; - varLeft=txt1_position.left; Wu  - //For elements with a vertical scrollbar, set to start at the 20th row of pixels down the overall content, displayed above the top of the scroll bar visual window About ///If no parameters, returns the vertex position above the visible window of the current scroll bar, and the distance from the vertex above the overall content $$("#div_outer"). ScrollTop (20); - //For elements with a horizontal scroll bar, set to start at the 20th column of pixels to the left of the overall content, and display the left vertex in the scroll bar visual window - ///If no parameters, returns the left vertex position of the current ScrollBar visual window and the distance from the left end vertex of the overall content -$("#div_outer"). ScrollLeft (20); A  + 


JS and jquery sample code for getting and modifying the value of a label, label tag used in JS and jquery can not get its value with value like other tags, there is a good example below, I hope you can learn the next two, get the value:


Label tags used in JS and jquery cannot get its value with value like any other label:

  1var label=document. getElementById ("ID");   2var value=label.value;   3var value=$ ("#id"). Val ();


Can do this:

  1var label=document. getElementById ("ID");   2var value=label.innertext;


Jquery:

  1var value=$ ("#id"). html ();


Assignment value:


Unlike Java,js and jquery, you can't assign values like this:

  1var label=document. getElementById ("ID");   2var value=label.innertext;   3 value= "XXXXXX";


  1var value=$ ("#id"). html ();   2 value= "XXXXXX";
You can assign values like this:
  1var label=document. getElementById ("ID");   2 label.innertext= "XXXXXX";   3 $ ("#id"). HTML ("XXXXX");









_______________________________________________________________

jquery gets and changes element attribute values

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.