0

I am new to the Web Development, so i am trying a to learn JavaScript, but i'm always getting this Error.

Code: 

var myImage = document.querySelector('img');

myImage.onclick = function () {
    var mySrc = myImage.getAttribute('src');
    if (mySrc === 'images/old-big-garage.png') {
      myImage.setAttribute('src', 'images/name1.png');
    } else {
      myImage.setAttribute('src', 'images/old-big-garage.png');
    }
}

Errors:

JSLint (4)
    4   Missing 'use strict' statement. var mySrc = myImage.getAttribute('src');
    6   Expected 'myImage' at column 9, not column 7.   myImage.setAttribute('src', 'images/papst.png');
    8   Expected 'myImage' at column 9, not column 7.   myImage.setAttribute('src', 'images/old-big-garage.png');
    10  Expected ';' and instead saw '(end)'.   }

ESLint (1)
    1   ERROR: 'document' is not defined. [no-undef]    var myImage = document.querySelector('img');
Noah
  • 1
  • 1
  • 1
  • How exactly are you trying to run that script? Because if you're using node, you're way off base. The above script needs to be included in an HTML document. –  Mar 27 '18 at 18:15
  • i am using it with an html script in the Brackets io. – Noah Mar 27 '18 at 18:16
  • Should i post the html File? – Noah Mar 27 '18 at 18:16
  • 1
    It looks like you're telling brackets to run/compile this. What you're supposed to do though is open the HTML file in your browser. Which tutorial/resource are you following? –  Mar 27 '18 at 18:17
  • Are you using some closure? – Sakshi Garg Mar 27 '18 at 18:18
  • I am following this "tutorial": https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web/JavaScript_basics – Noah Mar 27 '18 at 18:19
  • you can allow globals, such as document, in the eslint config: https://stackoverflow.com/questions/30398825/eslint-window-is-not-defined-how-to-allow-global-variables-in-package-json, but really you shouldn't need to compile your js – scrappedcola Mar 27 '18 at 18:20
  • 1
    @Noah Ok, so stop whatever you're trying to do and just do step 5. instead. (or save your script in the editor, then hit F5 in the browser to refresh) The process you're using that results in the errors you see is unnecessary for client side JS. –  Mar 27 '18 at 18:20
  • Thanks for the help, it was really my mistake – Noah Mar 27 '18 at 18:22

1 Answers1

0

The problem is with linter: ESlint. Try to install bracketeslint: File ->Extension Manager-> bracketeslint. After you are done with it, Debug -> Reload with Extension ( F5 ).

You could disable JSlint if you want. This way you will not get irritating warnings.

Hope that will work.

arsdever
  • 1,111
  • 1
  • 11
  • 32
Gaurav Kumar
  • 1