Using javascript, how can I change an attribute for ALL anchors (A:hover) on the webpage?
Using javascript to change styles
Collapse
X
-
Using javascript to change styles
How can I change a style attribute for all anchors on a webpage?
Right now, i have a link pointing to a javascript function; i.e.
<a href="javascrip t: ChangeLinkCurso r();">Click to change cursor when hovering over links</a>
What do i need to include in the ChangeLinkCurso r function to change the style for ALL anchors (not just for one link but for ALL links on the webpage, i.e. I don't want to use getElementById 500 times if there are 500 links on the page)? Is there a simple way to change the style like below, or do I need to use getElementsByTa g and use a for loop?
i.e. original style:
a:hover {cursor: default;}
new style:
a:hover {cursor: wait;}
Thanks!! -
-
I guess a better question, although a little broader, is the following: is there a way to change the style for a certain type of tag (using javascript)? i.e. How would i use javascript to change all divs from block elements to inline? Or change font size for all <P> from 16pt font to 12pt font? :confused:Comment
-
it's like you said, getElementsByTa gName(). although you can try the stylesheet object stylesheet – MDCComment
-
I'm not sure why you wouldn't just use the appropriate style to begin with but you can retrieve all elements of a particular type on a page in JavaScript using the document.getEle mentsByTagName method.
For example:
[code=javascript]
var allInputElement s=document.getE lementsByTagNam e('input');[/code]
The above code retrieves all input elements on the page...you can loop through them and check if their type is the type you want to apply the JavaScript to:
[code=javascript]
for(var i = 0; i < allInputElement s.length; i++)
{
var temp = allInputElement s[i];
if(temp.type==" ......")
{
//Do something
}
}
[/code]Comment
Comment