Run Javascript in Chrome with HTML

5 minutes
Share the link to this page
Copied
  Completed
You need to have access to the item to view this lesson.
One-time Fee
$39.99
List Price:  $79.99
You save:  $40
€38.34
List Price:  €76.69
You save:  €38.35
£31.81
List Price:  £63.63
You save:  £31.81
CA$57.41
List Price:  CA$114.84
You save:  CA$57.43
A$63.97
List Price:  A$127.96
You save:  A$63.98
S$54.21
List Price:  S$108.43
You save:  S$54.22
HK$310.92
List Price:  HK$621.91
You save:  HK$310.99
CHF 35.74
List Price:  CHF 71.50
You save:  CHF 35.75
NOK kr452.69
List Price:  NOK kr905.49
You save:  NOK kr452.80
DKK kr285.99
List Price:  DKK kr572.05
You save:  DKK kr286.06
NZ$70.70
List Price:  NZ$141.42
You save:  NZ$70.72
د.إ146.88
List Price:  د.إ293.80
You save:  د.إ146.92
৳4,759.62
List Price:  ৳9,520.44
You save:  ৳4,760.81
₹3,397.10
List Price:  ₹6,795.05
You save:  ₹3,397.95
RM180.27
List Price:  RM360.59
You save:  RM180.32
₦61,792.91
List Price:  ₦123,601.28
You save:  ₦61,808.36
₨11,086.54
List Price:  ₨22,175.86
You save:  ₨11,089.31
฿1,367.71
List Price:  ฿2,735.76
You save:  ฿1,368.05
₺1,402.52
List Price:  ₺2,805.39
You save:  ₺1,402.87
B$243.37
List Price:  B$486.81
You save:  B$243.44
R732.54
List Price:  R1,465.27
You save:  R732.72
Лв74.93
List Price:  Лв149.89
You save:  Лв74.95
₩57,842.33
List Price:  ₩115,699.13
You save:  ₩57,856.80
₪145.51
List Price:  ₪291.06
You save:  ₪145.55
₱2,352.81
List Price:  ₱4,706.21
You save:  ₱2,353.40
¥6,256.23
List Price:  ¥12,514.03
You save:  ¥6,257.80
MX$803.05
List Price:  MX$1,606.30
You save:  MX$803.25
QR145.19
List Price:  QR290.43
You save:  QR145.23
P550.51
List Price:  P1,101.16
You save:  P550.64
KSh5,142.14
List Price:  KSh10,285.57
You save:  KSh5,143.43
E£2,034.81
List Price:  E£4,070.14
You save:  E£2,035.32
ብር4,965.06
List Price:  ብር9,931.37
You save:  ብር4,966.30
Kz36,710.82
List Price:  Kz73,430.82
You save:  Kz36,720
CLP$39,506.29
List Price:  CLP$79,022.46
You save:  CLP$39,516.17
CN¥291.78
List Price:  CN¥583.63
You save:  CN¥291.85
RD$2,425.42
List Price:  RD$4,851.45
You save:  RD$2,426.03
DA5,393.73
List Price:  DA10,788.81
You save:  DA5,395.08
FJ$92.63
List Price:  FJ$185.29
You save:  FJ$92.66
Q306.89
List Price:  Q613.86
You save:  Q306.97
GY$8,332.99
List Price:  GY$16,668.06
You save:  GY$8,335.07
ISK kr5,538.46
List Price:  ISK kr11,078.31
You save:  ISK kr5,539.84
DH400.86
List Price:  DH801.83
You save:  DH400.96
L734.57
List Price:  L1,469.33
You save:  L734.75
ден2,358.54
List Price:  ден4,717.67
You save:  ден2,359.13
MOP$318.86
List Price:  MOP$637.80
You save:  MOP$318.94
N$733.28
List Price:  N$1,466.76
You save:  N$733.47
C$1,465.68
List Price:  C$2,931.72
You save:  C$1,466.04
रु5,417.88
List Price:  रु10,837.11
You save:  रु5,419.23
S/148.31
List Price:  S/296.66
You save:  S/148.35
K161.51
List Price:  K323.07
You save:  K161.55
SAR150.21
List Price:  SAR300.46
You save:  SAR150.25
ZK1,102.28
List Price:  ZK2,204.85
You save:  ZK1,102.56
L190.81
List Price:  L381.67
You save:  L190.86
Kč963.45
List Price:  Kč1,927.14
You save:  Kč963.69
Ft15,873.63
List Price:  Ft31,751.23
You save:  Ft15,877.60
SEK kr441.19
List Price:  SEK kr882.49
You save:  SEK kr441.30
ARS$40,705.74
List Price:  ARS$81,421.67
You save:  ARS$40,715.92
Bs275.23
List Price:  Bs550.54
You save:  Bs275.30
COP$174,344.67
List Price:  COP$348,732.94
You save:  COP$174,388.27
₡20,095.61
List Price:  ₡40,196.26
You save:  ₡20,100.64
L1,011.06
List Price:  L2,022.38
You save:  L1,011.31
₲310,574.38
List Price:  ₲621,226.44
You save:  ₲310,652.05
$U1,776.52
List Price:  $U3,553.49
You save:  $U1,776.96
zł163.49
List Price:  zł327.04
You save:  zł163.54
Already have an account? Log In

Transcript

Another way of running your JavaScript code is by using your browser. Whether you are using Google Chrome, or Firefox or any browser, you can run your JavaScript code. So for example, it's up in Google Chrome window. So as you can see, I have this window. Now, I'm going to click on, I'm going to just right click and click inspect. And I am going to have this elements.

And then besides it, I have a window, or I have a tab called console, click on it. And then here, you can type your JavaScript code and it's going to run immediately. So here, I'm going to use the same exact code that we use before, which is this one, console dot log. I'm going to copy it and I'm going to get back to our browser. And here what I'm going to do is I'm going to paste the same exact code and hit Enter. And as you can see, it says here, this is a test, which means that this code has been executed.

So this is another way of running or implement or executing your JavaScript code is by typing the code in the console. And of course, this is not the perfect way of doing so. Because most of the time, you will have a lot of code here. And it's difficult just to copy and paste. So it's important to use a text editor. And suppose that this risk code is very long and you want to and you want to execute it in the console or in the browser.

In other words, what you need to do instead is that you are not going to use a JavaScript code law, you are not going to use a JavaScript file like this, you first need to create an HTML file. So I'm going to create an HTML here, new file and call it Save it first Save As. And I'm going to call it index dot HTML. And I'm going to save it on my desktop. Alright. So now we have this index dot HTML on our desktop file.

And in order to add a JavaScript code into HTML file, what you need to do is you need to use tags, some kind of tags. And this tag that we are going to use is called script script. And then, as you can see, it's, you need just to open the script brackets and TypeScript and then the type text slash JavaScript, and then close the tag. And inside those tags, you need to add your JavaScript code. So here what I'm going to do is that I'm going to copy this code again. And I'm going to paste it inside.

And just for I'm just I'm going to add year, as simple as that. So that we know that we are running this HTML code in our browser. So here I'm going to type h1. And when I close the stack, and I'm going to type JavaScript, Java Script. And I'm going to save Click on Save. And finally, what I'm going to do here is that I'm going to go to Tools and build system.

And I'm going to change change the build system to Google Chrome. Here, I have Chrome, click on it, and then click on build here, this one build. And as you can see, now, the index that HTML file has been opened in our Google Chrome browser. Now if I get to the log, I'm going to right click and inspect. As you can see, on the on the console, I'm going to see this code. This is A test.

And I'm going to prove to you that JavaScript code is running by using a method called alert. I'm going to type alert, and then test, just test. And if I save and run again, or refresh, as you can see, I am going to get this pop up message saying tests, which means that our JavaScript code has been successfully executed. And if your code did not run for any reason, by using the build system here, by using the chrome build system, you just need to click on this file on HTML file, double click. And as you can see, it's going to up in in your browser. If now I click on the inspect again, I should see in the console, I should see the code this one and if I refresh, I'm going to see this popup message which says of tests.

And what that means is that these two lines of code have been executed, which means that JavaScript runs successfully. But in our course, we are not going to use this myth method. The method that we are going to use is we are going to use the build system here inside inside our Sublime Text, because it's the easier and because we are not going to use HTML at all in this course, this is a JavaScript code. So we are going to focus totally on JavaScript

Sign Up

Share

Share with friends, get 20% off
Invite your friends to LearnDesk learning marketplace. For each purchase they make, you get 20% off (upto $10) on your next purchase.