本文共 3280 字,大约阅读时间需要 10 分钟。
讲到JavaScript,倒数第二节课了。
首先,JavaScript是一门语言,然后能用JavaScript写代码,这些JavaScript代码一般都是在客户端(浏览器上)运行的。
使用一些框架,比如Node.js,JavaScript代码也能在服务器上运行。然后,使用JavaScript是为了让HTML页面变得更好看。
一直听到这个概念。
视频中简单提到两句: The front end gives us better user interface. The back end serves us data and searches things for us.找了很多解释,大概如下:
第五课讲到了数据结构,HTML是基于树结构存储数据的。
比如,下面的一个典型的HTML文档:
<!DOCTYPE html>
申明这是一个HTML5文档。 script
标签也对应着head
或body
结点下的一个子结点。在script
标签中写我们的JavaScript代码。然后来看JavaScript的语法。
script
标签之间的是JavaScript代码 document.write("Hello World!")
write()
用来向文档写 HTML 表达式 或 JavaScript 代码。JavaScript的代码更接近C语言,函数的定义方法如下:
function functionname(){ 要执行的代码}
例如下面,把Hello World!
写在函数中。
script
标签之间,但是这里将script
标签写在了head
标签下。 body
标签中定义了一个按钮,同时定义了点击按钮这个事件发生后,调用hello()
函数。 hello()
函数内部使用了Window 对象中的alert()
方法,显示带有一段消息和一个确认按钮的警告框。一样的概念,变量用来存储数据。
var name;
用来定义一个name
变量。不用事先申明变量类型。 name = "FengWeilei"
来对变量赋值。 document.write(name);
用来将name
变量中的数据写到文档中。(每个载入浏览器的 HTML 文档都会成为 Document 对象。write()
用来向文档写 HTML 表达式 或 JavaScript 代码。)JavaScript有Number、String、Boolean、Array、Object 这些数据类型。
结合变量一起看(尝试了一下,省去关键词var
,不影响结果):
var a = 6;
var b = "a string";
var c = true;
(true
、flase
首字母小写,别加引号,不然成字符串了) var d = ["Nice","Day","HaHa"];
(这样定义最方便,和python列表类似,也能使用d[2]
访问列表中元素)。 var person={ name : "FengWeilei", age: 22, home : "China"};
这个对象
类型存储数据的格式,就是经常见到的JSON(JavaScript Object Notation)。重点看这个person
变量,或者说JavaScript对象。
person
有三个属性,name
、age
、home
,每个属性有对应的属性值。 var person={ name : "FengWeilei", age: 22, home : "China" };
person.name
可以访问person
对象中的name
属性的值。JavaScript语言中也有for
循环和while
循环,还有do while
循环。写法和C语言类似。
满足哪个条件,执行之后的代码。
下面的例子可以看到if
语句的用法,语法和C语言类似。 form
表单中都是html的语法。主要看这个onsubmit="fun_if();"
,即用户提交表单这个事件发生后,调用fun_if()
函数。 if
语句写在了fun_if()
函数中。和C语言中语法类似。 i = document.getElementById('an_int').value
获取id
属性为an_int
的元素(标签)的值。对应着下面用户提交表单中输入框的输入内容;然后将用户输入值存储在变量i
中。 i
(用户输入值)的大小展示不同的结果。Learn JavaScript
然后,JavaScript大多数语法和C语言类似,或者本质上和许多编程语言都一样,这里就不再往下写了。
w3school网站有。可以边写代码边学习语法。
得知道为什么要用JavaScript,或者用JavaScript来干什么。
HTML中有很多,比如鼠标滚动、鼠标点击、鼠标停留在某个元素上、表单提交等等等等
这些事件发生后,需要运行相应的脚本,让用户看到不同的消息(或者页面效果)。这样,用户体验才会好。
对这些事件发生做出的反应,不是后端完成的,而是由前端完成的。即浏览器运行一些脚本,在这里,这些脚本就是JavaScript代码。
然后,就联系上了。HTML事件发生后,浏览器中运行一些JavaScript代码,来对这些事件做出反应。
JavaScript存在于全世界所有 Web 浏览器中,一般用来对网页进行改进设计、验证表单、检测浏览器、创建cookies,以及更多的应用。
然后,回到最开始的地方。
script
标签之间。 script
标签的src
属性指向HTML文档外部的一个JavaScript文件。 可以指向HTML代码目录中的某个 js 文件的地址:<script src="base.js"></script>
也可以输入URL指向互联网上某个js文件资源: <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
script
标签,直接写JavaScript代码就好。最后,
JavaScript作为一门语言,和C语言、Python一样,有一些库,例如jQuery,库中有别人写好的函数,不用自己写函数了,只要会用就行了。
JavaScript更多的都是前端来实现,前端开发也有相应的框架,例如bootstrap,会让前端开发更容易一些。