Home > Developer > JavaScript
Record only new knowledge and examples of learning, stemless goods.
1.setAttribute and GetAttribute (Attribute: Properties)
SetAttribute: Adds the specified property to the element and assigns it a value, or only sets or alters its value if the specified property already exists.
Calling method: Element.setattribute (Attributename,attributevalue)
This is a method with no return value, IE8 and below are not supported.
GetAttribute: Returns the property value for the specified property name.
Calling method: Element.getattribute (AttributeName)
The return value is a string
Summary: AttributeName is the attribute name of the element, AttributeValue is the attribute value of the element, both of which are character types
Example:
1 varcomm={2 //SetAttr is a method for object comm that sets properties for an element3 //e is a formal parameter, which represents the element name; strname is a formal parameter that represents the name of the property being set; strvalue is a parameter that represents the value of the property being set .4SetAttr:function(e,strname,strvalue) {5 E.setattribute (strname,strvalue);6 },7 //GetAttr is a method for object comm that gets the element properties8 //e is the formal parameter, which represents the element name; strname is a formal parameter that represents the name of the property being set, no value9GetAttr:function(e,strname) {Ten returnE.getattribute (strName); One } A}
The above is a way to customize an object that is used to set properties on an element.
An example of a change to the invocation object implementation element property is as follows:
1 <!DOCTYPE HTML>2 <HTML>3 <HeadLang= "en">4 <MetaCharSet= "UTF-8">5 <Scripttype= "Text/javascript"src=.. /.. /js/system.js></Script>6 <title></title>7 <styletype= "Text/css">8 . Red{9 width:260px;Ten Height:100px; One Line-height:100px; A text-align:Center; - Border:Solid 1px Red; - margin:Auto; the } - . Blue{ - width:260px; - Height:100px; + Line-height:100px; - text-align:Center; + Border:Solid 1px Blue; A margin:Auto; at } - </style> - </Head> - <Body> - <DivID= "a"class= "Red">hello,js!</Div> - <DivID= "B">hello,js2!</Div> in <BR/> - <inputtype= "button"value= "Point I change Color"ID= "Bitred"/> to <Scripttype= "Text/javascript"> + //defines a variable clasname that holds the class attribute value of an element obtained with ID number a using comm.getattr - varClasname=comm.getattr ($$ ("a"),"class"); the //Call the Comm.serattr function to set the class property for an element with ID number B, and a property value of Clasname, both a class property value * comm.setattr ($$ ("b"),"class", clasname); $ //set the Click event for an element with an ID number of bitredPanax Notoginseng $$("bitred"). onclick=function(){ - //setting properties for an element the //the Console.log () method is used to detect if the binding is successful and can be removed + Console.log ("123"); A //sets the style for the element with ID A, and the arguments in parentheses correspond to the formal parameter E,strname,strvalue the comm.setattr ($$ ("a"),"class","Blue");//property Name, property value + //defines a variable clasname that holds the class attribute value of an element obtained with ID number a using comm.getattr - //This variable is clasname as a local variable, unlike the previous $ varClasname=comm.getattr ($$ ("a"),"class"); $ //Call the Comm.serattr function to set the class property for an element with ID number B, and a property value of Clasname, both a class property value - comm.setattr ($$ ("b"),"class", clasname); - } the </Script> - </Body>Wuyi </HTML>View Code
The requirement for this example is to set the style for an element with ID A, the element style with ID B follows the style of element A, the button is clicked, the style of element a changes, and the style of element B changes.
Start by defining a global variable clasname, and call the Comm object's GetAttr method to get the property of element A, and use the SetAttr method of the Comm object to set the property for element B, which is required to start the element B property following element a. Then click the event, first call the Srtattr method of the Comm object to set a new property for element A, and define the local variable Clasname store the properties of a with the GetAttr method of the Comm object, and then set the properties stored in the local variable clasname to B.
JavaScript common methods and Functions (SetAttribute and GetAttribute)
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
