From the course: JavaScript: Enhancing the DOM
Unlock this course with a free trial
Join today to access over 25,300 courses taught by industry experts.
Manipulating attributes and data attributes
From the course: JavaScript: Enhancing the DOM
Manipulating attributes and data attributes
- [Instructor] You already know, we can alter the values of input elements and alter the innerHTML and innerText properties. You can also alter attributes. Attributes are additional information for HTML elements, like href, src, or an id. JavaScript lets us manipulate these easily. You can alter any attributes. In order to do that, you can use the getAttribute and setAttribute. Again, you first need to select the element. With getAttribute, you can get the value of an attribute. If you want to change the value, you can use the setAttribute, for example, to change the source of an image. Here, we have a simple webpage. Once the button is clicked, the function changeAttributes is triggered, and this is what changeAttributes does right now. It's going to change the source of an image. As you can see, it's going to select the image with ID exampleImage, and then it's going to use the setAttribute to go ahead and change the src, and then it inputs the value. So first, you have the type of…
Contents
-
-
-
-
-
-
(Locked)
Changing text and HTML content2m 51s
-
(Locked)
Changing values of input elements4m 35s
-
(Locked)
Manipulating attributes and data attributes2m 1s
-
(Locked)
Working with classes2m 21s
-
(Locked)
Inline styles with JavaScript2m 9s
-
(Locked)
Challenge: Shapeshifter50s
-
(Locked)
Solution: Shapeshifter47s
-
(Locked)
-
-
-
-
-
-