Question

var eles = document.querySelectorAll('li.level a'),
    i;

for (i = 0; i < eles.length, i++) {
  eles[i].onclick = function() {
    //...
  };

}

now, i want to make when the mouse over the a text, i want to change finger pointer to crosshair.so i make the above code to the following: but it doesn’t work.

for (i = 0; i < eles.length, i++) {
      eles[i].onclick = function() {
        //...
      };
eles[i].onmouseover = function(this) {
        this.style.cursor="crosshair";
      };

    }

the code doesn’t work, how to correct it? thank you

if i only want to change it by javascript with the above code, how should i do?

Answer 1

What you have will work if you get rid of the argument. Since this is a reserved word you can’t name an argument this:

eles[i].onmouseover = function() {
    this.style.cursor="crosshair";
};

Here’s a working example.

However, as has already been stated in the comments, a better approach may be to just use CSS:

li.level a:hover {
    cursor: crosshair;
}

Here’s an example of the CSS version.

---

Side notes

• You also have a syntax error in your for loop:

  for (i = 0; i < eles.length, i++) // Wrong
  for (i = 0; i < eles.length; i++) // Right (semi-colon, not comma)
  

• It’s generally better practice to use addEventListener instead of setting the onsomevent property. You can use attachEvent to support old versions of IE.