Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

javascript setAttribute style

I don't get how the two following javascript/css codes can produces different result:

1st:

prev.setAttribute('style', 'position:absolute;left:-70px;opacity:0.4;border-radius: 150px;-webkit-border-radius: 150px;-moz-border-radius: 150px;');

2nd:

            prev.setAttribute('style', 'opacity:0.4;border-radius: 150px;-webkit-border-radius: 150px;-moz-border-radius: 150px;');
            prev.setAttribute('height', size);
            prev.setAttribute('width', size);
            prev.setAttribute('id', 'thumb'+i);
            prev.setAttribute('position', 'absolute');
            prev.setAttribute('left', '-70px');

in the 2nd one, position and left are completely ignored. The result are the same for having the 2 lines of codes and not having them.

It only works if I put prev.style.left, the same thing with position. However setAttribute works for height and width. I really need to know why

like image 864
user308553 Avatar asked Sep 29 '13 16:09

user308553


People also ask

What is setAttribute in JavaScript?

setAttribute() Sets the value of an attribute on the specified element. If the attribute already exists, the value is updated; otherwise a new attribute is added with the specified name and value.

How do you append styles in JavaScript?

First, select the element by using DOM methods such as document. querySelector() . The selected element has the style property that allows you to set the various styles to the element. Then, set the values of the properties of the style object.

Can JavaScript change HTML attribute values?

Javascript can be used to change the attribute(s) of a HTML element, such as a paragraph, a header, an image, or a list, or any various HTML elements.


1 Answers

position and left are not attributes, they are styles.

width, height and id can be used as attributes or styles, which is why they work in your second example.

like image 190
Timm Avatar answered Oct 21 '22 19:10

Timm