2016年11月20日算是每天都会利用点时间去思考,去学习,接下来便是我学习JavaScript的前前后后,希望早日学完JavaScript和jQuery

之前学校毕业设计选择了一个如下图的题目

希望可以早日知道这里面到底都使用了什么功能才形成了如此神奇的二维码

如下刚学的例子:

1、通过js脚本改变原有的背景颜色

<!DOCTYPE html>
<html lang = "zh-cn">
<head>
<meta charset = "UTF-8">
<title>关于背景色</title>
</head>
<body bgcolor=white>
<p>Paragraph 1</p>
<script type="text/javascript">
// 改变背景颜色
document.bgColor = "red";
</script>
</body>
</html>

代码仅仅是用来演示,在实际的应用中,如果要将页面的背景色设置成红色,可直接将<body>标记的bgcolor属性设置为“red”即可,并不需要使用JavaScript。例如:如果用户显示器的分辨率比较低,可以使用JavaScript调整页面上的内容。另外,使用JavaScript修改属性还可以实现一些特效,比如实现页面颜色的渐变效果。

2、当页面加载时,首先看到第一段落的内容,即Paragraph 1,然后是一个消息框,这个消息框是由第一个脚本块产生的。这是,浏览器的页面解析过程将被挂起(halt),并一直等待你单击消息框的OK按钮。颜色在点击按钮后在变化,点击按钮之后网页才会向下解析。

<!DOCTYPE html>
<html lang = "zh-cn">
<head>
<meta charset = "UTF-8">
<title>关于背景色</title>
</head>
<body bgcolor=white>
<p>Paragraph 1</p>
<script type="text/javascript">
// document.bgColor = "red";
// script block 1
alert("First script block");
</script>
<p>Paragraph 2</p>
<script type="text/javascript">
// script block 2
document.bgColor="red";
alert("Second script block")
</script>
<p>Paragragh 3</p>
</body>
</html>

通过这个实例,就是可以了解到两种不同的方法来设置页面的背景属性。比如设置页面的背景色属性时,既可以通过HTML标记进行设置,是一种静态的方法,将属性值直接写在HTML  ,除非直接修改HTML,否则它的值不会改变;也可以通过JavaScript代码进行设置,可以在程序中动态的改变属性的值。

*动态:指某些元素的属性值或外观是可以改变的,可以在代码中改变它们的值,从而改变这些元素。

不同的浏览器所支持的HTML标准的版本也可能存在差异,不同浏览器中JavaScript解释器所支持也可能有所不同。例如在一个浏览器只能实现图片的移动可能就需要几行或者几十行也可能无法实现。

小结:

至2016.11.24

记JavaScript的入门学习(一)的更多相关文章

  1. 记JavaScript的入门学习(三)

    2016.12.6晚上十点半完成JavaScript的第二章学习,看了点第三章的开头总述,都说原生js每一个知识点都可以分分钟钟让你放弃,而我在努力探索着.月末的时候就回家放假了,希望在家也可以有个小 ...

  2. 记JavaScript的入门学习(二)

    2016年11月25号,利用上午时间学习了JavaScript的数据类型和变量,下午就该去图书馆泡书了. 看完变量的本章节,发现我可能不能一天结束,那我就利用上午和晚上九点回来的时间完成吧.把心态调整 ...

  3. javascript的入门学习

    目录 JavaScript的学习 什么是javascript,如下简称JS 正式使用js js的两种引入方式 head标签与body标签的区别 js定义变量 可以分为如下四种类型: 有3种特殊的数据类 ...

  4. 【总结整理】javascript基础入门学习(慕课网学习)

    https://www.imooc.com/learn/36 注意: javascript作为一种脚本语言可以放在html页面中任何位置,但是浏览器解释html时是按先后顺序的,所以前面的script ...

  5. JavaScript 的入门学习案例,保证学会!

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. 第一百一十九节,JavaScript事件入门

    JavaScript事件入门 学习要点: 1.事件介绍 2.内联模型 3.脚本模型 4.事件处理函数 JavaScript事件是由访问Web页面的用户引起的一系列操作,例如:用户点击.当用户执行某些操 ...

  7. JavaScript入门学习之二——函数

    在前一章中讲了JavaScript的入门语法,在这一章要看看函数的使用. 函数的定义 JavaScript中的函数和Python中的非常类似,只不过定义的方式有些不同,下面看看是怎么定义的 //定义普 ...

  8. ReactJS入门学习二

    ReactJS入门学习二 阅读目录 React的背景和基本原理 理解React.render() 什么是JSX? 为什么要使用JSX? JSX的语法 如何在JSX中如何使用事件 如何在JSX中如何使用 ...

  9. ReactJS入门学习一

    ReactJS入门学习一 阅读目录 React是什么? React如何制作组件? 理解组件属性props 理解页面中如何渲染数据的 理解从服务器端获取数据及理解state的 回到顶部 React是什么 ...

随机推荐

  1. linux网卡驱动安装及锐捷使用

    原创博文,转载请注明出处 先吐槽一下,以前装了个Centos win7双系统, 然后手贱一不小心把启动文件给删了,接下来就用grub恢复启动文件,整了一天也没搞出来还把win7的Boot Manage ...

  2. Tomcat7 Cluster 集群

    Tomcat7 自带的集群功能是通过session复制完成的,现有两个复制方式: DeltaManager: 将session复制到所有tomcat节点中,不管是否有相应的应用(it will rep ...

  3. 应用facebook .net sdk

    1.本博客主要介绍如何应用facebook .net SDK,实现发帖.点赞.上传照片视频等功能,更多关于facebook API,请参考:https://developers.facebook.co ...

  4. journaling保证意外故障下的数据完整性

    mongoDB研究笔记:journaling保证意外故障下的数据完整性   mongoDB的Journaling日志功能与常见的log日志是不一样的,mongoDB也有log日志,它只是简单记录了数据 ...

  5. Python之FTP多线程下载文件之分块多线程文件合并

    Python之FTP多线程下载文件之分块多线程文件合并 欢迎大家阅读Python之FTP多线程下载系列之二:Python之FTP多线程下载文件之分块多线程文件合并,本系列的第一篇:Python之FTP ...

  6. 数据访问模式之Repository模式

    数据访问模式之Repository模式   数据访问层无非就是对数据进行增删改查,其中增.删.改等我们可以抽象出来写一个公共的接口或抽象类来定义这些方法,并采用一个基类实现这些方法,这样该基类派生的子 ...

  7. 2013 多校联合 2 A Balls Rearrangement (hdu 4611)

    Balls Rearrangement Time Limit: 9000/3000 MS (Java/Others)    Memory Limit: 65535/32768 K (Java/Othe ...

  8. 构建RESTful风格的WCF服务

    构建RESTful风格的WCF服务 RESTful Wcf是一种基于Http协议的服务架构风格. 相较 WCF.WebService 使用 SOAP.WSDL.WS-* 而言,几乎所有的语言和网络平台 ...

  9. 可供VC调用的QT编写的界面DLL方法

    一般直接编写的QT动态库是无法被Windows下的VC6.0等调用的. 如下步骤 第一步:必须要在QT界面库源码下包含qtwinmigrate的源码包和库,网上可下载到. 第二步:在QT的proc文件 ...

  10. [Oracle] CPU/PSU补丁安装教程

    什么是CPU/PSU Oracle CPU的全称是Critical Patch Update, Oracle对于其产品每个季度发行一次安全补丁包,通常是为了修复产品中的安全隐患. Oracle PSU ...