学习HTML5+CSS3+Javascript的第一周

Javascript是一种轻量级、解释型的Web开发语言。JS代码需要写在<script></script>标签中,作为脚本语言的标识符来分隔其他源代码。避免与html标签和css样式混淆。

js代码严格区分大小写。javascript暂不支持constant关键字,不允许用户自定义常量。javascript使用var关键字声明变量,先声明后使用;声明变量之后,在没有初始化之前,它的初始值为undefined(未定义的值)。变量命名规则:1.首字符必须是大写或小写字母、下划线、或美元符,后续字符可以是字母、数字、下划线、美元符2.变量名称不能是Javascript的关键字或保留字。3.变量名称长度任意,但要区分大小写。(注意:变量名称应该易于理解)。

数据类型:string字符串  Number数值   Boolean布尔值  Null空值  Undefined未定义 Object对象。

运算符:算数运算符        逻辑运算符  位运算符 赋值运算符 较运算符 特殊运算符 条件运算符(?:)也是javascript唯一的一个三元运算符

下面是我利用了一点js做的进度条

<section>
            <p>百分比进度:
            <progress id="progress" max="100"><span>0</span>%</progress></p>
            <input type="button" onclick="click1()" value="显示进度" />
        </section>
        <script>
            function click1(){
                var progress=document.getElementById("progress");
                progress.getElementsByTagName("span")[0].textContent="0";
                for (var i=0;i<=100;i++) {
                    updateProgress(i);
                }
            }
            Function updateProgress(newValue){
                var progress=document.getElementById("progress");
                progress.value=newValue;
                progress.getElementsByTagName("span")[0].textContent=newValue;
            }
        </script>

做出的预览效果如下:

原文地址:https://www.cnblogs.com/halilulu/p/9429515.html

时间: 2024-10-03 20:47:29

学习HTML5+CSS3+Javascript的第一周的相关文章

HTMl5/CSS3/Javascript 学习推荐资源

HTMl5/CSS3/Javascript 学习推荐资源 前端的定义应该是数据内容的展示,在国内大家都觉得前端只是HTML+CSS+Javascript,但是实际上与展示有关的都是前端,所以Ruby/Python/Nodejs/Java/ASP .NET只要和展示有关的部分都可以称之为前端.在这里由于篇幅的限制,我们只推荐与HTML+CSS+Javascript三者有关的前端技术 入门 w3school html5 简单HTML5的入门教程 w3school css3 简单的CSS3入门教程 J

学习HTML5+CSS3的第二天

今天第二天学习Html5+css3 今天根据书上一共写了两个小实例 第1个实例关于音频播放文件 1 <!DOCTYPE HTML> 2 <html> 3 <body> 4 <video tideh="320" height="240" contorls="controls"> 5 <source src="/i/movie.ogg" type="video/ogg

学习进度条01(第一周)

编写代码所花的总时间:330min 编写代码总行数:651行 1.加减乘除算式输出小程序:140min 318行 2.javaweb实验作业1:160min 296行 3.自己测试学习:30min 37行 了解到的知识点: 1.javascript语言实现:时间的实时显示 2.javascript语言实现:图片的自动切换 3.javascript语言实现:tab页的制作 4.<body>内的doucument.write函数 5.<body>内可直接放置javascript语言 6

检测 HTML5\CSS3\JAVASCRIPT 在浏览器的适应情况

CSS3 Selectors Test : 这是CSS3.INFO网站提供的css选择器测试页面,它能够详细显示当前浏览器对所有CSS3选择器的支持情况.启动测试,浏览器会自动测验,并已列表的方式显示当前浏览器对所有css3选择器的支持情况     http://tools.CSS3.info/selectors-test/test.html When can I use :这是一个专业的测试网站,为广大网页设计师提供CSS3\HTML5\SVG\JAVAScript api 技术的浏览器支持情

Python学习笔记——基础篇【第一周】(未完待续)

学习Python目的: 1.学完之后,可以做开发运维监控.自动化软件.聊天软件.BBS.博客和网站. 2.投资自己,结识更多的朋友,变更更优秀的人 Python第一周笔记 Python语言介绍 python创始人Guido,荷兰人,Python源自他所挚爱的电视剧Monty Python's Flying Circus.Python编译器使用C语言实现,能够调用C语言库文件.1991年初,Python发布了第一个公开发行版. Python版本: Python1.0   1994年 python2

web前端全部课件(html5+CSS3+javascript+dom+bom+jquery+jqm+bootstrap+angular+ext+weixin+less)

一.HTML5 BASIC课件 Unit01:Web基础知识.HTML快速入门.文本 Unit02:图像和链接.表格.结构标记 Unit03:列表.表单.其他常用标记 二.CSS3 BASIC课件 Unit01:CSS 概述.CSS 语法\尺寸与边框 Unit02:框模型.背景.渐变\文本格式化-1 Unit03:文本格式化-2.表格.浮动.显示 Unit04:列表.定位 三.京东首页实战(无PPT) 四.WEB UI课件 Unit01:Photoshop基本操作.网页切图.图像优化 Unit0

移动网页设计与开发 HTML5+CSS3+JavaScript

第1章 网络平台1.1 对术语的简短说明1.2 你是谁,你需要知道些什么1.3 了解什么是HTML51.4 真正的HTML51.5 CSS3及其他1.6 浏览器支持1.7 测试,再测试,进行更多的测试总结 第2章 结构和语义2.1 HTML5的新元素2.2 网页易读性倡议的无障碍的富因特网应用程序组件(WAI-ARIA)2.3 语义标记的重要性2.4 微格式2.5 RDFa2.6 微数据2.7 数据属性2.8 Web组件:标记的未来?总结 第3章 设置响应性CSS3.1 媒体查询3.2 Java

2019前端面试经典(html5+css3+JavaScript)

前端目录 HTML相关 CSS相关 JAVASCRIPT相关 DOM相关 HTTP相关 VUE相关 算法相关 网络安全相关 webpack相关 其他 Html相关 1 html语义化 意义:根据内容的结构化(内容语义化),选择合适的标签(代码语义化)便于开发者阅读和写出更优雅的代码的同时让浏览器的爬虫和机器很好地解析.注意: 1.尽可能少的使用无语义的标签div和span: 2.在语义不明显时,既可以使用div或者p时,尽量用p, 因为p在默认情况下有上下间距,对兼容特殊终端有利: 3.不要使用

学习ASE高级软件工程的第一周

1. 介绍自己 Hello,大家好久不见!我叫许嘉祺,是中国科学技术大学新大四学生,很高兴能来到MSRA实习.我平时大部分时间都花在学习上了,因此我的青春没有暗恋和校花,只有de不完的bug和掉在地上的头发.在如此大的压力之下,我会选择玩游戏来放松自己.这也算是我的爱好和特长吧.平时主要玩王者荣耀和和平精英.王者荣耀一般单排上星耀,操作不算太骚,意识不算太好,手速不算太快,英雄池不算太深.和平精英打得比较多,习惯五指操作,闪身枪提前抢拜佛枪,跳狙甩狙瞬狙,假雷烟夹雷瞬爆雷,绕后游击拉枪线,样样精