jQuery选择器找到DOM元素，但本机javascript选择器返回未定义

Question

I was using the native Javascript selector on a div element like following

var slider_image=document.querySelectorAll('.slider');
    slider_image.style.opacity=0;

This returns me uncaught typo error. Cannot set the opacity of undefined. However, when I find the div element using the selector in the console, I get the DOM. But again I can't set the opacity values as it shows the same error.

However, the jquery selector perfectly does the job. What is the problem here?

Could anyone suggest?

Thanks

Answer 1

Because querySelectorAll returns a list and list doens't have the properties you are looking for.

Where as Jquery maintains the collections of selected Objects and do things internally and apply the changes you asked for.

However you can do the same with Native script aswell. All you need to do is iterate over the returned list and apply the styles on each object instead of applying it to the list directly.