关于JavaScript的那点事

作者: 徐慕熹微 | 来源:发表于2016-07-06 21:23 被阅读639次

HTML----从页面结构,语义上描述页面

CSS------从审美的角度装饰页面

JavaScript--从交互的角度提升页面用户体验

交互:就是网页的元素针对用户的特定行为,产生指定的变化。就是响应事件。

一、什么是JavaScript?

(1)JavaScript 是用来实现交互的。

(2)JavaScript是纯文本的,用任何的纯文本编辑器都能够编辑它(记事本,notepad++、editplus、Dw、sublime)

(3)也是网页的一部分,随着html的请求,JavaScript也随之加载到本地,在本地渲染运行的JavaScript 脚本不保密,所有的代码都可以通过查看源代码获取。

(4)JavaScript、PHP、ASP、JSP区别:

    JavaScript和PHP、ASP、JSP完全不同;

           JavaScript是运行在 用户的计算机 中的是前台的脚本;PHP、ASP、JSP是运行在服务器上的

          JavaScript的功能单一,仅仅用来开发页面效果的;PHP等语言可以与数据库交互、开发网站程序的

        有JavaScript的网页是静态网页,不是动态网页(假如一个网页有JavaScript花花绿绿的,他仍然是静态网页,所谓的动态,静态是指:能否与数据库产生交互);只有PHP、ASP、JSP这些网页,才是动态网页。

二、开发工具sublime

打开sublime,是一个空白文档,此时输入“html:xt”,按住快捷键"Ctrl+E" 即可。


整个框架就构建好了

一些快捷键:

按CTRL+鼠标滚轮:调整字号;

输入div*5,在按Ctrl+E:就能生成5个div盒子模型;

按鼠标中键(即滚轮):可以多行编辑;

CTRL+shift+K:删除当前行;

CTRL+shift+D:复制当前行;

CTRL+shift+上下键:调整当前行的位置

CTRL+Alt+[ :可以让CSS格式进行转换(单行/多行)


三、对象、属性、标题

对象:万物皆对象。

所谓的对象,就是一个物体,一个实体。

对象一定是有一个名字的。在JavaScript中也有很多对象,这些对象是天生存在在JavaScript里面,比如:document是一个对象,window也是一个对象。

JavaScript想调用一个对象,非常的简单,直接打他的名字就行。

每个对象负责的事情不一样:document负责一切和文档相关的事情;window负责一切和浏览器窗口相关的事情。

执行什么事情,就要写找准对象

所有的对象都是名词,“美丽”“可爱”“漂亮”都不是对象。

对象是有类型的,猪八戒、孙悟空、二郎神是一类;西瓜、馒头、蟠桃是一类

属性:属性是描述一个对象的。

所以一提到属性,一定是某一个对象。比如:猪八戒这个对象,就有 年龄、性别、身高、性别等属性;西瓜的属性:大小、颜色、重量。

对象或多或少都有属性,属性的不同,对象的不同。

所有的对象都有属性:document对象,title就是document对象的属性,描述的是文档的标题;window对象,location是window对象的属性,描述的是浏览器当前所在的页面URL。

如果你想更改一个对象的属性,就要用语法:对象。属性=“新的值”;等号表示赋值,将等号右边的值赋予左边。这是一个命令,是命令计算机立即执行的。等号不是表示相等,而是命令

正确的语法:document。cookie=“新的值”;(对象。属性=“新的值”)

方法:就是一个对象能够做的行为。比如:猪八戒有睡觉方法、打怪方法、化缘等行为。

JavaScript 中的对象,也都有一些能够做的事情,也都有一定的方法。

比如:widow 对象就有一个alert方法。window对象能够做alert这个事情

命令一个对象立即执行它的方法   的方法:对象。睡觉(“参数”);如:猪八戒。睡觉(“5小时”);那猪八戒就会立即停止手上的工作,进行睡觉。

所谓的“参数”就是一定的配置这个方法的一定的数据。

用户看不见控制台,是为了方便调试程序,我们经常在控制台输出文字。我们要用的对象是 console 对象,调用它的log方法,参数就是要输出的文字,比如:console.log(“哈哈”)

响应事件的一个能力,让一个html元素能够响应事件,就给这个标签加上onclick=“自己起名()”即可。

四、操作页面元素

事件源:有监听的HTML标签,能响应事件的HTML标签,就是事件源。

事件名:用户的特定行为,比如 onclick。

事件的响应:就是一个个function。

事件的响应,就是function,那么编程就是编写事件的响应。响应中,最重要的就是要想清楚被操作的对象。

第一个程序:点击第一个盒子第二个盒子变蓝;

第一个盒子为事件源,第二个盒子称为被操作对象。

getElementById  —— 通过Id得到元素

document.getElementById("box2").style.backgroundColor= "blue";

现在要让盒子2变蓝,所以就要让JavaScript得到盒子2这个元素。得到元素的方法,就需要通过Id得到它。

document.getElementById("");这种命名法称为驼峰命名法。

长的一个单词,是由多个单词组成的,第一个单词的首字母小写,之后的每一个单词的字母都大写。很像一个低头吃草的骆驼。

点击一个盒子让另外一个盒子变色。点击谁,谁的身上就有onclick;你要操作谁,谁就必须要有id,书写document.getElementById("")得到它。

找准事件源,用户点击哪个盒子,会有事情发生,这个盒子就是事件源,它身上就有onclick属性,

找准谁是被操作的对象,被操作的对象可能不止一个,并且事件源自己也有可能是被操作的对象,被操作的对象身上一定要有id.

第一次分享跟技术有关的文章,以后会陆续更新,欢迎小伙伴们一起交流,共同进步。

相关文章

  • 关于JavaScript的那点事

    HTML----从页面结构,语义上描述页面 CSS------从审美的角度装饰页面 JavaScript--从交互...

  • 关于JavaScript的那点事(二)

    JavaScript最初的目的:判断客户端的输入; JavaScript现在的意义:用于页面特效(PC端的网页效果...

  • 关于那点事

    感情是很古怪的事情 一时之间让你认不清楚自己

  • 微光故事:关于蛇的那点事!

    微光故事:关于蛇的那点事! 2017-03-22刀狼微光故事 微光故事:关于蛇的那点事! 一提及蛇,大多数人都怕,...

  • 关于时区的那点事

    php 学习笔记之关于时区的那点事_慕课手记

  • 关于HTTPS的那点事

    从http看https的诞生缘由 本文重点不在于http,所有对http的原理和过程不做过多仔细的说明。我们熟悉的...

  • 关于初恋的那点事

    你是从几岁接触爱这个东西? 不是只有十八九二十岁的才叫爱 那是我对同桌有记忆的起点。小学的我们喜欢小打小闹,我跟他...

  • 关于头发的那点事

    初中三年,我一直留着一头男士青年头。走在一群女生中间,显得格外耀眼。 这发型确实给我带来了很多的“不便利”。 比如...

  • 关于面试的那点事

    近几年参与单位的几场招聘与招生,每次面试也都有分笔试与面试。但每次招收进来的人总是不尽如人意,有的性格与岗位...

  • 关于写作的那点事

    关于写作,我经常听人提到:写作是需要天赋的。当然,对于这一观点,我深信不疑。然而在我认为,后天的磨练更为重要。写作...

网友评论

    本文标题:关于JavaScript的那点事

    本文链接:https://www.haomeiwen.com/subject/vhgkjttx.html