JavaScript零基础入门 | day1：JavaScript表格

 Java学习路线思维导图： Java学习路线思维导图

 Java学习路线总结：搬砖工逆袭Java架构师

 Java经典面试题大全：10万字208道Java经典面试题总结(附答案)

 简介：Java领域优质创作者、CSDN哪吒公众号作者✌ 、Java架构师奋斗者

 扫描主页左侧二维码，加入群聊，一起学习、一起进步 

 欢迎点赞  收藏 ⭐留言    

目录

一、百度百科

二、简单表格

1、代码实例

2、效果展示

三、表格中添加样式

1、代码实例

2、效果展示

四、长表格

1、代码实例

2、效果展示

五、表格嵌套

1、代码实例

2、效果展示

六、输出日志

1、alert

2、document.write()

3、console.log()

七、Javascript代码编写位置

1、代码实例

2、效果展示

八、基本语法

九、【粉丝福利】

【送书啦】

【赚取积分方式】哪吒社区内发帖、点赞、评论都可赢取积分！

以下图书，四选一！

一、百度百科

Javascript（简称“JS”） 是一种具有函数优先的轻量级，解释型或即时编译型的编程语言。虽然它是作为开发Web页面的脚本语言而出名，但是它也被用到了很多非浏览器环境中，Javascript 基于原型编程、多范式的动态脚本语言，并且支持面向对象、命令式、声明式、函数式编程范式。 
Javascript在1995年由Netscape公司的Brendan Eich，在网景导航者浏览器上首次设计实现而成。因为Netscape与Sun合作，Netscape管理层希望它外观看起来像Java，因此取名为Javascript。但实际上它的语法风格与Self及Scheme较为接近。 
Javascript的标准是ECMAscript 。截至 2012 年，所有浏览器都完整的支持ECMAscript 5.1，旧版本的浏览器至少支持ECMAscript 3 标准。2015年6月17日，ECMA国际组织发布了ECMAscript的第六版，该版本正式名称为 ECMAscript 2015，但通常被称为ECMAscript 6 或者ES2015。 

二、简单表格

1、代码实例

	
		
		
	
	
		
		

			
			
			

				
				
哪吒
				
哪吒社区
				
打卡
				
Java
			
			
			

				
Javascript
				
vue
				
react
				
				
angular
			
			
			

				
比比东
				
云韵
				
纳兰嫣然
			
			
			

				
斗皇
				
斗圣
				
				
斗帝
			
			
		
		
		
	

2、效果展示

三、表格中添加样式 1、代码实例

	
		
		
		
			table{
				
				width: 500px;
				
				margin: 50px auto;
				
				
				
				border-spacing: 100px;
				
				
				border-collapse: collapse;
			}
			
			td,th{
				
				border: 1px solid black;
			}
			
			tbody > tr{
				background-color: #bfa;
			}
			
			
		
	
	
		
		
		

			
			
			

				
				
学号
				
姓名
				
年龄
				
社区
			
			
			

				
1
				
哪吒
				
18
				
CSDN
			
			
			

				
2
				
比比东
				
21
				
武魂殿
			
			
			

				
3
				
云韵
				
19
				
云岚宗
			
		
		
	

2、效果展示

四、长表格

HTML中还为我们提供了三个标签，用来将表格分成三个部分。

我们可以将对应部分的tr，放到指定的标签，使用这三个标签创建的表格，在打印时，会在每页都打印表格的头部和底部，无论编写到什么位置，thead中的内容，永远都会显示在表格的头部，而tfoot中的内容，永远都会显示在表格的底部。

1、代码实例

	
		
		
		
			
			table{
				width: 500px;
				margin: 0 auto;
				border-collapse: collapse;
			}
			
			td{
				border: 1px solid black;
			}
			
		
	
	
		

			
			

				

					
姓名
					
社区
					
社区人数
					
合计
				
			
			
			

				

					

					

					
合计
					
55400
				
			
			
			
			

				

					
哪吒
					
哪吒社区
					
50000
					
50000
				
				

					
比比东
					
武魂殿
					
2000
					
2000
				
				

					
云韵
					
云岚宗
					
300
					
300
				
				

					
雅妃
					
米特尔家族
					
100
					
100
				
				

					
美杜莎
					
蛇人部落
					
3000
					
3000
				
			
		
	

2、效果展示

五、表格嵌套

在一个表格中也可以嵌套其他的表格，在很久以前，我们经常使用表格在页面中进行布局，此时就需要使用大量的表格的嵌套，表格布局，布局起来非常的简单，但是维护起来非常的麻烦，所以现在已经很少有人用，表格的列数由td最多的那个tr来决定。

1、代码实例

	
		
		
	
	
		

			
			

				

			
			
			

				

				

					
					

						

							
哪吒
						
						

							
跟着哪吒学Java
						
					
					
				
			
			
			

				

			
			
		
	

2、效果展示

六、输出日志

1、alert

控制浏览器弹出一个警告框

alert("大家好，我是哪吒！");

2、document.write()

页面中输出一个内容

document.write()可以向body中输出一个内容

document.write("请大家关注哪吒社区");

3、console.log()

向控制台输出一个内容

console.log()的作用是向控制台输出一个内容

console.log("请大家加入我的微信交流群，不定期还有抽奖送书活动

七、Javascript代码编写位置

可以将js代码编写到外部js文件中，然后通过script标签引入。

写到外部文件中可以在不同的页面中同时引用，也可以利用到浏览器的缓存机制。

script标签一旦用于引入外部文件了，就不能在编写代码了，即使编写了浏览器也会忽略， 如果需要则可以在创建一个新的script标签用于编写内部代码。

可以将js代码编写到标签的onclick属性中，当我们点击按钮时，js代码才会执行，虽然可以写在标签的属性中，但是他们属于结构与行为耦合，不方便维护，不推荐使用。

1、代码实例

	
		
		
		
		
		
		
	
	
		
		
		哪吒
		
		
		博客专家
		CSDN
		
	

2、效果展示

八、基本语法

1. 多行注释
2. 单行注释
3. Javascript中严格区分大小写
4. Javascript中每一条语句以分号(;)结尾
5. 如果不写分号，浏览器会自动添加，但是会消耗一些系统资源，
6. 而且有些时候，浏览器会加错分号，所以在开发中分号必须写
7. Javascript中会忽略多个空格和换行，所以我们可以利用空格和换行对代码进行格式化

8. 字面量，都是一些不可改变的值

9. 变量    变量可以用来保存字面量，而且变量的值是可以任意改变的，变量更加方便我们使用，所以在开发中都是通过变量去保存一个字面量，而很少直接使用字面量，可以通过变量对字面量进行描述

10. 标识符   在JS中所有的可以由我们自主命名的都可以称为是标识符

例如：变量名、函数名、属性名都属于标识符
命名一个标识符时需要遵守如下的规则：
1.标识符中可以含有字母、数字、_、$
2.标识符不能以数字开头
3.标识符不能是ES中的关键字或保留字
4.标识符一般都采用驼峰命名法
首字母小写，每个单词的开头字母大写，其余字母小写helloWorld xxxYyyZzz。

JS底层保存标识符时实际上是采用的Unicode编码，所以理论上讲，所有的utf-8中含有的内容都可以作为标识符。

九、【粉丝福利】

送书啦，大家期待已久的Vue！

本次活动送书规则：

【送书啦】

1、社区积分榜前5名，随机抽取一名幸运者

2、社区积分榜6-15名，随机抽取一名幸运者

3、社区积分榜16-30名，随机抽取一名幸运者

【赚取积分方式】哪吒社区内发帖、点赞、评论都可赢取积分！

 社区入口：哪吒社区

以下图书，四选一！

1、Vue.js全家桶零基础入门到进阶项目实战
2、Java高并发编程指南
3、亿级流量Java高并发与网络编程实战
4、Web前端性能优化 

 添加微信，备注1024，赠送Java学习路线思维导图