昨天咱们学习了 document.write(“你好”),有的同学可能会有那么一点点成就感,但是有的同学呢,可能就会觉得不就打两个字吗?有啥好说的,今天咱们来弄个好玩的,怎么让百度“谷歌一下”
在这之前,咱们把昨天的内容回忆一下(没看过昨天内容的,可以去看一下)。
在现实生活中,组成人类社会的最小元素就是一个一个的人,虽然人下面还有细胞、分子、原子,但那些并不会产生一个独立的思想。
而在我们的程序结构中,最小的元素就是一个一个的“语句”,只有组成一个完整的语句,这个程序才能干活。
document.write(“你好”)就是一条语句。
正如我们平时说话用的自然语言一样,程序语言,它也是一种“语言”,自然语言用于和人交流,而程序语言是用来间接的和计算机交流的。
自然语言有“主谓宾,定状补”的结构,那么我们的程序语言也是有结构规范的,这些都是这门编程语言发明者人为规定的,这些语法、结构,咱们作为学习者,如果你觉得语法、结构规定不合理,那么你可以努力学习,以后也自己发明一门语言,在此之前,你只需要被动的接受就行。
在我们上一节课的学习中, document 指的就是文档这个玩意儿,书面一点的说法叫做一个“对象”(不是相亲那个对象哈)。而 write 我们就叫做“方法或能力”,而 “你好” 就叫做“实参”,而那个document 和 write 中间的点“.”,就是javascript发明者的一个“规定”,你不打那个点,他就不认可你,而 write 这个方法后面是一定要加括号()的。
举个现实的例子, 你可以把具体的某个人比如说“张三”当做一个“对象”,然后“吃饭”当做一个“方法”,很明显一个对象是可以具有很多个“方法或能力”。张三这个对象,他不止能“吃饭”,还能“说话、走路,我们可以用生活中的对象和方法来仿写几个。
张三.吃(“肉”)
小狗.咬(“小猫”)
鸭子.游泳(5) 这个5是啥意思?可能是5公里,也可能是5天,今天暂时不学,以后再说
同样,我们从现实中可以知道,一个人,他不止拥有吃喝拉撒这些能力(方法),还有身高体重这些“属性”,我们的javascript对象其实也是有属性的,我们来玩一个好玩的,咱们先打开百度的网页,然后按F12,进入console之后,输入下面的代码:
document.title = "我是谷歌";
这又是一种新的“语句”,语法是 对象.属性 = 值; <-最后这个分号,人家发明者说了,可以写也可以不写,写不写他都认。来仿写一下就是:
小明.身高 = “5cm”, 老师.颜值 = “超帅”
好了,闲话少说,咱们回到浏览器上,敲一下回车看看吧?你看到了什么?
—— 恭喜你成功的把“百度”变成了“谷歌”(不用担心百度找你麻烦,你的这个改变只有你自己能看到,不会影响他人,所以别以为咱在教你黑客技术)

我们的现实世界你可以称做“对象”,我们所在的城市,你也可以称做“对象”,而我们的“城市”这个对象,也不止我们一个“种类”的“对象”
所以我们在浏览器上执行的 javascript 当然也不止 document 这么一个对象了,window是浏览器上的javascript所能操作的最大的对象,你可以把window当成我们的地球,而document是仅次于window的对象,你可以把它看作我们的中国,所以由此应该可以意识到我们的document下面还有更小的对象了吧?
既然要让“百度”去“谷歌一下”,那我们就先打开百度网页吧。

我们的网页上有很多很多的对象,所有的网站大都具有一些相同的元素种类,大家都要用这些东西,所以我们需要做一些约定,弄出来大家都能看得懂,免得像南方人去到北方,不知道山药蛋就是土豆,北方人到了南方,也不知道大白菜叫果筒菜一样,其实是一样东西,这个在日常生活中,最多就是闹闹笑话,大家哈哈一下就算了,但在程序员的世界里,这就是灾难,世界末日,所以我们的老一辈的程序员们绝对是不允许这种情况出现的,于是他们开了几次会,统一了一下叫法,最终形成了”html”这个知识点(敲黑板)
那么今天我们要把“百度一下”改成“谷歌一下”怎么办呢?用上面讲的方法,我们可以先写一个“伪代码”,所谓“伪代码”就是给人看的,不需要电脑懂,到时候我们翻译一下就成为了程序。
我们的伪代码就是:
写得有百度一下的那个按钮.文字 = “谷歌一下”
那么我们怎么才能得到写得有“百度一下”的那个按钮呢?来跟我学,简单得很,鼠标指着“百度一下”那个按钮,然后选择“检查”

然后会出现如下界面:

它默认已经给你“选中”了,颜色不一样的就是我们要的那个按钮,那里头的代码是啥意思我们暂时不管,我们只需要关注到代码里有一个位置是【value=”百度一下”】就行了。
按钮已经找到了,但是怎么在程序里头使用呢?再接着跟我做,在被选中的那段代码(有背景颜色那段)上点击鼠标右键,然后选择“Store as global variable”,这句英文的意思是“保存到全局变量”


Console窗口变大后,我们就能看到如下图所示的内容了。

相当于,它把那个按钮,保存到了一个叫 temp1 的变量中,这里又多了一个新名词“变量”,咱们先完成作业,后面再来讲解。先回到刚才的“伪代码”
写得有百度一下的那个按钮.文字 = "谷歌一下"
现在按钮有了,叫 temp1,它设置文字的属性是啥呢?还记得上面我们提到的【value=”百度一下”】吗?

对,就是它了,好了,我们的真实代码就有了(属性需要注意大小写 value 可以, Value 不行哈)。
写得有百度一下的那个按钮.文字 = "谷歌一下"
temp1.value = "谷歌一下"
在console里把这行代码录入,并敲个回车看看效果 ?

怎么样?百度的网页上居然出现了“谷歌一下”的文字,好玩不?
有同学说光好玩有啥用?又不能装B,来来来,我教你个装B的玩意儿,用上头教你们的办法,去把你自己支付宝上的余额改一下,然后截个图,出去找你的酒肉朋友们吹下牛吧,可别说我教的,不过我估计你们有可能搞不定,因为支付宝上的余额不是显示在“按钮”上的,所以不能用 value 这个属性了,html中两个背靠背的标签(><)里头的内容,属性是”innerText” 或”innerHTML”(属性注意大小写,属性注意大小写,属性注意大小写,属性注意大小写)

好了,作业做完了,接下来讲点儿枯燥的东西,上面我们接触了一个新名字叫“变量”,这个变量其实跟数学里头的“变量”是差不多的意思,我们解方程的时候的 x,y,z就是变量。
用现实生活来举例,你可以把变量当做一个箱子,你可以把你要用的东西,临时放到这个箱子里,你可以给这个箱子取个名字,就叫变量名称,比如说你叫它“一号宝箱”,然后你把手机放这个箱子里了,那么写成程序就是:
一号宝箱 = 手机
这里的等号,不是说一号宝箱等于手机的意思,箱子和手机怎么会是一个东西呢?而是说把手机装到一号宝箱里的意思,为啥要用等号而不是用 <== 或 ==> 之类的呢?这个就要问发明 javascript 的那个大神了,如果你来发明一个语言,你完全可以写成 手机 ==> 一号宝箱,如果以后有中文编程,是不是可以直接叫 【手机 装进 一号宝箱】 。
总之呢,别人怎么规定,咱们就怎么用吧,还是那句话,除非你自己发明一种编程语言,否则就必须接受别人的规定。
javascript 的变量(宝箱)能装的东西很多,但是就像道生一、一生二一样,它的基础变量就那么几种,其它的都是由这几种基础变量组合而成,比如:
i = 1 //整形变量
s = "abc" //字符串型
f = 1.1 //浮点型
a = [1,2,3,4,5] //数组
o = new Object() //对象类型
javascript 定义变量还可以在最前头加 var
var 变量名称 = 变量值;
变量名称 = 变量值
在很多情况下 加了 var 的变量和 没加 var 的变量是一个意思,但还有些情况不一样,这就涉及到变量的作用域,我们以后讲到函数的时候再讲吧。