JS基础代码
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>Title</title>
6 </head>
7 <body>
8 <h1>我的第一个Web页面</h1>
9 <p id="demo">我的第一个段落</p>
10 <p id="demo1">我的第2个段落</p>
11 <button onclick="myFunction()">点我</button><br>
12 <button onclick="myFunction1()">点我一下</button><br>
13
14 <button onclick="myFunction2()">点我一下-while</button>
15
16
17
18 <script>
19 function myFunction(){
20 document.getElementById("demo").innerHTML ="段落已修改";//使用 "id" 属性来标识 HTML 元素，并 innerHTML 来获取或插入元素内容
21 window.alert(5+6);//弹出警告框
22 document.write(Date());
23 document.write("<h1>这是一个标题</h1>");//将内容写到 HTML 文档中
24 document.write("<p>这是一个段落</p>");
25
26 }
27 var d = new Date();
28 var time = d.getHours();
29 if(time<10){
30 document.write("<b>早上好</b>");
31 }else if(time>=10 && time<20){
32 document.write("<b>今天好</b>");
33 }else {
34 document.write("<b>晚上好!</b>")
35 }
36 cars = ['BMW','Volvo','Saab','Ford'];
37 for (var i=0;i<cars.length;i++){
38 document.write("<br>"+cars[i]);
39 }
40
41 function myFunction1() {
42 var x;
43 var txt = "";
44 var person = {fname:"Bill ",lname:"Gates ",age:56};
45 for (x in person){
46 txt+=person[x];
47 }
48 document.getElementById("demo").innerHTML = txt;
49 }
50
51 function myFunction2() {
52 var x = "",i = 0;
53 while (i<5){
54 x = x+"该数字是"+i+"<br>";
55 i++;
56 }
57 document.getElementById("demo").innerHTML = x;
58 }
59
60 var x = function (a,b) {return a*b};//以上函数实际上是一个 匿名函数 (函数没有名称);函数以分号结尾，因为它是一个执行语句
61 document.getElementById("demo").innerHTML =x(4,3);
62
63 var x = findMax(1,33,55,45,77,500);//找到最大的一个参数的值
64 function findMax() {
65 var max = arguments[0];
66 if (arguments.length<2) return max;
67 for (var i = 0; i<arguments.length; i++){
68 if(arguments[i]>max){
69 max = arguments[i];
70 }
71 }
72 return max;
73 }
74 document.getElementById("demo").innerHTML = x;
75
76 var m = 10;
77 var y = sumAll(m,33,55,45,77,500);//创建一个函数用来统计所有数值的和
78 function sumAll() {
79 var sum = 0;
80 for (var i = 0; i<arguments.length; i++){
81 sum+=arguments[i];
82 }
83 return sum;
84 }
85 document.getElementById("demo1").innerHTML = y;
86 </script>
87
88
89 </body>
90 </html>
JS基础代码的更多相关文章
- js基础 - 兼容代码
js基础 - 兼容代码 . scrollTop . chrome document.body.scrollTop . IE && firefox document.documentEl ...
- js基础梳理-究竟什么是执行上下文栈（执行栈），执行上下文(可执行代码）？
日常在群里讨论一些概念性的问题,比如变量提升,作用域和闭包相关问题的时候,经常会听一些大佬们给别人解释的时候说执行上下文,调用上下文巴拉巴拉,总有点似懂非懂,不明觉厉的感觉.今天,就对这两个概念梳理一 ...
- js基础之javascript的存在形式和js代码块在页面中的存放位置和 CSS 对比
1.存在形式 文件 如: <script src='js/jc.js'></script> 前页面 <script type='text/javascript'>a ...
- js 基础篇（点击事件轮播图的实现）
轮播图在以后的应用中还是比较常见的,不需要多少行代码就能实现.但是在只掌握了js基础知识的情况下,怎么来用较少的而且逻辑又简单的方法来实现呢?下面来分析下几种不同的做法: 1.利用位移的方法来实现 首 ...
- js 基础
js基础知识点总结 如何在一个网站或者一个页面,去书写你的js代码:1.js的分层(功能):jquery(tool) 组件(ui) 应用(app),mvc(backboneJs)2.js的规划():避 ...
- js基础练习二之简易日历
今天学到了js基础教程3,昨天的课后练习还没来的及做,这个是类似简易日历的小案例,视频还没听完,今晚继续...... 先看效果图: 其实做过前面的Tab选项卡,这个就很好理解了,通过鼠标放在不同月份月 ...
- [JS复习] JS 基础知识
项目结尾,空闲时间,又把<JS 基础知识> 这本书过了一遍,温故知新后,很多知其然不知其所以然的内容 豁然开朗. [1. 用于范围的标签] display :inline or bloc ...
- JS基础（超级简单）
1 JS基础(超级简单) 1.1 数据类型 1.1.1 基本类型: 1) Number:特别注意:NaN的检测方法:Nan!=NaN;或者使用isNaN方法 2) ...
- Node.js基础与实战
Node.js基础与实战 Node.jsJS高级进阶 NODE原理与解析 REPL交互环境 模块与NPM Buffer缓存区 fs文件操作 Stream流 TCP&UDP 异步编程 HTTP& ...
随机推荐
- ES6-ES12部分简单知识点总结，希望对大家有用~
ES6-ES12简单知识点总结 1.ES6相关知识点 1.1.对象字面量的增强 ES6中对对象字面量的写法进行了增强,主要包含以下三个方面的增强: 属性的简写:当给对象设置属性时,如果希望变量名和属性 ...
- go语言学习入门篇1---go语言的主要特性与发展
1.1 影响 Go 语言发展的早期编程语言 正如 "21 世纪的 C 语言" 这句话所说,Go 语言并不是凭空而造的,而是和 C++.Java 和 C# 一样属于 C 系.不仅如此 ...
- Java基础知识 String StringBuffer StringBuilder三者的区别(面试题)
相同点:String.StringBuffer.StringBuilder最终底层存储与操作的都是char数组,StringBuffer和StringBuilder都继承了AbstractString ...
- 使用过 Redis 分布式锁么，它是什么回事？
先拿 setnx 来争抢锁,抢到之后,再用 expire 给锁加一个过期时间防止锁忘记了 释放. 这时候对方会告诉你说你回答得不错,然后接着问如果在 setnx 之后执行 expire 之前进程意外 ...
- Java 中 Semaphore 是什么？
Java 中的 Semaphore 是一种新的同步类,它是一个计数信号.从概念上讲,从 概念上讲,信号量维护了一个许可集合.如有必要,在许可可用前会阻塞每一个 acquire(),然后再获取该许可.每 ...
- Spring 支持的事务管理类型？
Spring 支持两种类型的事务管理:编程式事务管理:这意味你通过编程的方式管理事务,给你带来极大的灵 活性,但是难维护.声明式事务管理:这意味着你可以将业务代码和事务管理分离,你只需用 注解和 XM ...
- 利用事件的冒泡特性，为子标签添加Onclick事件
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...
- （stm32f103学习总结）—初识stm32
STM32分类 STM32的命名方法 怎样选择合适的MCU 一个原则:花最少的钱,做最多的事 在确定项目需求的情况下,一般按照下面的顺序来选择合适的MCU 如何分配原理图引脚 如何寺找引脚的功能说明 ...
- [C/C++基础知识] main函数的参数argc和argv
该篇文章主要是关于C++\C语言最基础的main函数的参数知识,是学习C++或C语言都必备的知识点.不知道你是否知道该知识?希望对大家有所帮助.一.main()函数参数通常我们在写主函数时都是void ...
- 前端入门-day2（常见css问题及解答）
写在前面 今天是入门前端的day2, 小伙伴们应该已经看了一些HTML的基础和CSS的基础了,是不是遇到了很多关于CSS的问题呢.因为HTML很少有太复杂的问题,所以直接写一篇关于CSS的常见问题及解 ...