jquery gets and changes element attribute values

Source: Internet
Author: User

(from the already dead time and again finally hung out of the Baidu space manually rescued, published on 2014-04-18)

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.

================================== Action Element Properties ==================================

Returns an element that specifies a property value

var txt1_val=$ ("#txt1"). attr ("value");

Changing DOM property values through the DOM property name of an element

$ ("#txt1"). attr ({value: "Txt1_value", ClassName: "Txt1_class"});

changing element property values by specifying element properties

$ ("#txt1"). attr ("Class", "Txt1_class2");

Assigns a value to the specified element property, returning the value by the method that is bundled later

$ ("#txt1"). attr ("Class", function () {

return "TXT1_CLASS3";

})

Removes the specified element property

$ ("#txt1"). Removeattr ("class");

================================== Modifying CSS Classes ==================================

Add a property value to a CSS class that is a 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_class txt1_class2");

Determines if the CSS class is already in existence and returns TRUE or False

$ ("#txt1"). Hasclass ("Txt1_class txt1_class2");

Removes the specified CSS class, separated by a space, and removes all CSS classes for the element, if none is specified

$ ("#txt1"). Removeclass ("Txt1_class");

Determine if there is a CSS class that has to be deleted, not just add

$ ("#txt1"). Toggleclass ("Txt1_class");

Add this CSS class according to the back of the return, false to delete this CSS class

$ ("#txt1"). Toggleclass ("Txt1_class", false);

================================== Modifying CSS Properties ==================================

Returns the specified CSS style value

$ ("#txt1"). CSS ("color");

Assign multiple styles at once

$ ("#txt1"). CSS ({color: "#ff0011", Background: "Blue"});

Assigns a specified style at a time

$ ("#txt1"). CSS ("Color", "black");

================================== width and height related ==================================

Sets the height of the element, no value returns the height of the element in units of pixels

$ ("#txt1"). Height (25);

Sets the width of the element, and returns the width of the element without a value

$ ("#txt1"). Width (150);

Gets the inner height of the element, excluding the border

$ ("#txt1"). Innerheight ();

Gets the inner width of the element, not including the widening

$ ("#txt1"). Innerwidth ();

Gets the outer height of the element, including the border

$ ("#txt1"). Outerheight ();

Gets the outer width of the element, including the border

$ ("#txt1"). Outerwidth ();

================================== Location Related ==================================

Gets the offset position of the element relative to the window, returns two values, a top value, a left value

var txt1_offset=$ ("#txt1"). Offset ();

var top=txt1_offset.top;

var left=txt1_offset.left;

Returns the relative offset position of the relative parent element, returning two values a top, a left

var txt1_position=$ ("#txt1"). Position ();

var top=txt1_position.top;

var left=txt1_position.left;

The element that is targeted has a vertical scrollbar, and the setting starts at the 20th row of pixels down the overall content, and appears above the top of the ScrollBar visual window

If no parameters, returns the position of the vertex above the current ScrollBar Visual window, and the distance from the vertex above the overall content

$ ("#div_outer"). ScrollTop (20);

The element that is targeted has a horizontal scrollbar, which starts at the 20th column pixel to the left of the overall content, and is displayed in the left-hand vertex of the scrollbar visual window

If no parameters, returns the left vertex position of the current scroll bar visual window and the distance from the left vertex of the overall content

$ ("#div_outer"). ScrollLeft (20);

Reprinted from: http://www.eziep.net/details/17.html

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.