JavaScript 入门 (1)

一、 javascript的调用

JavaScript代码可以直接嵌在网页的任何地方,不过通常我们都把JavaScript代码放到<head>中:

<html>
<head>
  <script>
    alert(‘Hello, world‘);
  </script>
</head>
<body>
  ...
</body>
</html>

<script>...</script>包含的代码就是JavaScript代码,它将直接被浏览器执行。

第二种方法是把JavaScript代码放到一个单独的.js文件,然后在HTML中通过<script src="..."></script>引入这个文件:

<html>
<head>
  <script src="/static/js/abc.js"></script>
</head>
<body>
  ...
</body>
</html>

这样,/static/js/abc.js就会被浏览器执行。

把JavaScript代码放入一个单独的.js文件中更利于维护代码,并且多个页面可以各自引用同一份.js文件。

可以在同一个页面中引入多个.js文件,还可以在页面中多次编写<script> js代码... </script>,浏览器按照顺序依次执行。

有些时候你会看到<script>标签还设置了一个type属性:

<script type="text/javascript">
  ...
</script>

但这是没有必要的,因为默认的type就是JavaScript,所以不必显式地把type指定为JavaScript。

调试

俗话说得好,“工欲善其事,必先利其器。”,写JavaScript的时候,如果期望显示ABC,结果却显示XYZ,到底代码哪里出了问题?不要抓狂,也不要泄气,作为小白,要坚信:JavaScript本身没有问题,浏览器执行也没有问题,有问题的一定是我的代码。

如何找出问题代码?这就需要调试。

怎么在浏览器中调试JavaScript代码呢?

首先,你需要安装Google Chrome浏览器,Chrome浏览器对开发者非常友好,可以让你方便地调试JavaScript代码。从这里下载Chrome浏览器。打开网页出问题的童鞋请移步国内镜像

安装后,随便打开一个网页,然后点击菜单“查看(View)”-“开发者(Developer)”-“开发者工具(Developer Tools)”,浏览器窗口就会一分为二,下方就是开发者工具:

先点击“控制台(Console)“,在这个面板里可以直接输入JavaScript代码,按回车后执行。

要查看一个变量的内容,在Console中输入console.log(a);,回车后显示的值就是变量的内容。

关闭Console请点击右上角的“×”按钮。请熟练掌握Console的使用方法,在编写JavaScript代码时,经常需要在Console运行测试代码。

如果你对自己还有更高的要求,可以研究开发者工具的“源码(Sources)”,掌握断点、单步执行等高级调试技巧。

时间: 2024-08-07 02:02:20

JavaScript 入门 (1)的相关文章

JavaScript入门:005—JS基本语句

JS的基本语句如下.主要看看循环语句和选择语句.循环语句1.for循环 for(var i=1;i<100;i++){ //代码 } 2.do...while循环 var i = 0; do { i++; //代码 }while(i<100); 3.遍历 var array = new Array(); array[0] = "你懂的"; array[1] = "over"; array[2] = "呵呵"; array[3] = &

Javascript入门视频教程

1,第一节 http://pan.baidu.com/play/video#video/path=%2F%E6%95%99%E5%AD%A61.mov&t=-1 2,第二节 http://pan.baidu.com/play/video#video/path=%2FJavascript%E6%95%99%E7%A8%8B2.mov&t=-1 Javascript入门视频教程,布布扣,bubuko.com

JavaScript入门学习书籍的阶段选择

对于许多想学习 JavaScript 的朋友来说,无疑如何选择入门的书籍是他们最头疼的问题,或许也是他们一直畏惧,甚至放弃学习 JavaScript 的理由.在 JavaScript 方面,自己不是什么专家,也不是什么高手,但自己一路走来,JavaScript 从迷茫到认识,对于JavaScript 书籍的认识或许还有些借鉴价值.入门推荐首选书籍:<JavaScript DOM 编程艺术>当初读了不下 4 遍,书内容简单,易学,上手快,编程思想严谨.好的入门书,对你未来的编程都会有着深远的影响

&lt;javascript入门&gt;基本语法

<javascript入门>基本语法一.什么是javascript?javascript语言有什么特点?脚本语言的特点?    1.如果说css是给html页面进行化妆装饰以使html页面更加美观漂亮,那么javascript就是对html中DOM树上的节点进行增删改以使html页面实现动态的效果.    2.javascript语言是一种基于面向对象的.弱类型的.平台无关性的.安全性的语言.之所以说javascript基于面向对象是说它不是一种纯粹的面向对象,而是需要面向对象时即面向对象,需

JavaScript入门:001—概述

关于JavaScript JavaScript针对html页面进行交互行为:JavaScript是脚本语言,解释执行的:JavaScript可以直接嵌入html页面,也可以是个.js文件加载到html页面执行: JavaScript是免费的. JavaScript的作用 JavaScript是为html页面提供的编程工具 即使不是程序员也可以使用javascript进行页面的设计和美化,只需写一段javascript程序即可.JavaScript能响应事件 在html元素上设置一个事件,当事件被

JavaScript入门--慕课网学习笔记

 JAVASCRIPT-(慕课网)入门篇 我们来看看如何写入JS代码?你只需一步操作,使用<script>标签在HTML网页中插入JavaScript代码.注意, <script>标签要成对出现,并把JavaScript代码写在<script></script>之间. <script type="text/javascript">表示在<script></script>之间的是文本类型(text),ja

02.JavaScript入门基础

一.JavaScript数据结构: 标识符(变量名和函数名) JavaScript语言中标识符最重要的3点就是: (1)第一个字符必须是字母.下划线(_)或美元符号这3种其中之一,其后的字符可以是字母.数字或下划线.美元符号: (2)变量名不能包含空格.加号.减号等符号: (3)标识符不能和JavaScript中用于其他目的的关键字同名: .关键字(JavaScript关键字是指在JavaScript语言中有特定含义,成为JavaScript语法中一部分的那些字) .常量(常量的指从定义开始就是

LEADTOOLS HTML5&amp;Javascript 入门笔记

TODO:待编辑 将HTML5 / JavaScript查看器控件添加到HTML文档 <head> <script type="text/javascript"> run: function SiteLibrary_DefaultPage$run() { // Create the viewer var createOptions = new Leadtools.Controls.ImageViewerCreateOptions('imageViewerDiv'

JavaScript入门:003—JS中的变量

编程语言都是相同的,JS中也是有变量的.首先JS的变量是区分大小写的,这个需要注意,比如number和Number是不同的变量.不管是常用类型的,还是对象类型,比如 Object obj和Object Obj是两个对象.然后是对变量赋值,这个基本都一样,可以先声明再赋值, var i; i=0; 也可以声明时赋值, var i=2; 而变量如果你不重新赋值,它是不会改变的,比如 var i=2: var i; 因为i没有重新赋值,所以i还是2.而对于对象变量则比较有意思,不需要向那些java,c

JavaScript入门基础

JavaScript基本语法 1.运算符 运算符就是完成操作的一系列符号,它有七类: 赋值运算符(=,+=,-=,*=,/=,%=,<<=,>>=,|=,&=).算术运算符(+,-,*,/,++,--,%).比较运算符(>,<,<=,>=,==,===,!=,!==).逻辑运算符(||,&&,!).条件运算(?:).位移运算符(|,&,<<,>>,~,^)和字符串运算符(+). 可能很多人不知道&quo