三天速成前端——JavaScript

最新推荐文章于 2024-05-06 21:51:47 发布
最新推荐文章于 2024-05-06 21:51:47 发布
阅读量993 收藏 20
点赞数 2
分类专栏： 前端 文章标签： js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43772228/article/details/113804267
版权

JavaScript

JS是一门世界上最流行的类型脚本语言，源代码在发往客户端运行之前不需经过编译。最新版本es6，但大部分浏览器还停留在支持es5上！

​ JQuery：一个JS的方法库，可以直接调用

​ 三大框架：Angular、React、Vue（模块化+Dom）

一个合格的后端人员，一定要精通JavaScript

快速入门

		<!--script标签内，写JS代码-->
		<script>
			alert("hello world")
		</script>
		<!--外部引用，script标签必须成对出现-->
		<script src="js/test.js"></script>

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-ZkIAHiw8-1613226261993)(C:\Users\13611\AppData\Roaming\Typora\typora-user-images\image-20210210113631649.png)]

基本语法

			// 定义变量 变量类型 变量名=变量值
			var score=88;
			//在浏览器中打印变量，相当于sout
			console.log(score)
			// 条件控制 
			if(score>60 && score<80)
				alert("合格");
			else if(score>80 && score<100)	
				alert("优秀")

数据类型

数值，文本，图形，音频，视频…都是数据类型

number ：js不区分整数和小数，都用number

123//整数123
123.1//浮点数123.1
NaN //not a number
Infinity//表示无限大

字符串：单引号双引号都可以 eg：‘abc’ “abc”

比较运算符

=
== 等于（类型不一样，值一样，也会判断true）
=== 绝对等于（类型也一样，用这个！！！）

须知：NaN===NaN，与所有的数值都不相等，包括自己，只能通过isNaN(NaN)来判断

浮点数问题：会有精度缺失，要避免使用浮点数计算，用Math.abs()代替（Java中用BigDecimal）

console.log( (1/3) === (1-2/3))  //false
console.log( Math.abs((1/3) - (1-2/3))<0.0000001  )  //true

null和undefined

  • null 空
  • undefined 未定义

数组

var arr=[1,2,3,'hello',null,true]; //不需要相同对象

取数组下标：如果越界了，就会undefined

对象

			//大括号，用逗号隔开    person.name 获取
			var person={
				name:"carmine",
				age:21,
				tags:['js','html','css','...']
			}

严格检查模式

			//严格检查模式，必须写在script的第一行
			'use strict';
			//用let，避免全局变量
			let i=1;

字符串

			//转义字符
			console.log('a\'');
			console.log('a\nb');
			//多行字符串，用tab上面的·
			var msg=
			`	你好
				Java
			`
			//模板字符串,ES6新特性
			var name="carmine";
			var msg1="你好，${name}"
			
			//字符串长度
			console.log(msg1.length)
			
			//字符串不可变，大小写
			console.log(name.toUpperCase())
			
			//substring,[)
			console.log(name.substring(1))  //armine 从第一个字符串截取到最后一个
			console.log(name.substring(1,3)) //ar  [1,3)

数组

			//中括号
			var arr=[1,2,3,4,5,"1","2"]; 
			arr[0]=0;//通过下标可以修改值
			
			//给length赋值，数组长度会发生变化（与java不同）
			arr.length=10; 
			
			arr.indexOf(2); //1
			arr.indexOf("2");  //6，是不同的
			arr.slice(2); //与substring类似

			arr.push("a","b");//压入到尾部
			arr.pop();//尾部弹出
			arr.unshift("1");//压入到头部
			arr.shift();//头部弹出

			arr.sort();
			arr.reverse();//元素反转
			arr.concat([1,2,3]);//拼接，该方法并没有修改原来的数组，只是									返回一个新的

对象

			//所有的健都是字符串，值是任意对象
			var person={
				name:"carmine",
				age:21,
				score:91,
				tags:['js','html','css','...']
			}
            
            //给属性复制（Dev中）
            person.name="zhouyi"
            //不存在的属性不会报错！undefined，也可动态添加属性
            person.haha="haha"
			//动态删除属性
			delete person.name
			//判断属性值是否在对象中
			'age' in person  // true
			'toString' in person//true 继承
			//判断是否自身拥有
			person.hasOwnProperty("toString") //false
            person.hasOwnProperty("age") //true

流程控制

与Java基本一致

for(var index in object){...}

Map和Set

ES6的新特性

Map：k-v键值对的集合

			var map=new Map([['tom',100],['jack',90]],['haha',80]);
			var name=map.get('tom');
			map.set('admin',123); //添加Map元素

Set：无序不重复的集合

			var set=new Set([3,1,1,2,4]);//去重
			set.delete(2); //删除
			console.log(set.has(3)); //是否包含某个元素,true

iterator

使用iterator来遍历迭代Map、Set、Arr

			//遍历Map、Set、Arr
			for(var x of map){
				console.log(x);
			}

函数及面向对象

定义函数（两种方法）

			function abs(x){
				if(x>=0)
					return x;   //返回结果
				else
					return -x;
			}

如果没有执行return，函数也会返回结果：undefined

			var abs=function(x){ //方法2：匿名函数
				if(x>=0)
					return x;  
				else
					return -x;
			}

输入格式问题：传递进的不是数字

				if(typeof x!=='number'){   //不是数字
					throw 'Not a Number';   //手动抛出异常
				}

参数问题：JS可以传递任意个参数，也可以不传递参数（都不报错）

				if(arguments.length==2)  //JS自带arguments
				{
					//函数重载
				}

arguments问题：arguments包含所有的参数，有时候需要用剩余的参数

			var abs=function(x,y,...rest){
				if(typeof x!=='number'){   //不是数字
					throw 'Not a Number';   //手动抛出异常
				}
				if(arguments.length>2)  //JS自带arguments
				{
					//函数重载
					console.log(rest);
					
				}
				if(x>=0)
					return x;   //返回结果
				else
					return -x;
			}

rest参数：只能写在最后面，必须用 … 标识

变量作用域

在JS中，var定义变量实际是有作用域的。

			function a(){
				var x=1;
				x=x+1;
			}
			x=x+2;  //Uncaught ReferenceError: x is not define

内部函数可以访问外部函数成员，反之不行；内外函数的变量名相同，不冲突

			function a(){
				var x=1;
				function b(){
					var y=x+1;
                    var x='a'; //替代外部变量
					console.log(x); //a
				}
				var z=y+1;  //Uncaught ReferenceError: z is not defined
                console.log(x);//1
				b();
			}

变量规范：便于代码维护

			function c(){
				var x,y,z...; //js执行引擎会自动提升变量声明
				//养成规范，在一开始定义所有变量，之后随意用。
			}

全局对象

			//全局变量
			var x=1;
			window.alert(window.x); //默认所有的全局变量，都会绑定在window对象下

alert本身也绑定在window下的变量（方法也可以作为变量）

			var old_alert=alert;
			window.alert=function(){
				
			};
			window.alert(123); //失效
			//恢复
			alert=old_alert;
			window.alert(456);

JS实际上只有一个全局作用域，如果在局部没有找到变量，就往外找，如果window也找不到，报错 RefrenceError

规范：降低window全局匿名冲突的问题，jQuery. 等价于 $

			//定义唯一全局变量，减少window冲突
			var Carmine={};
			//定义全局变量，绑定到Carmine
			Carmine.name='zhouyi';
			//定义全局方法
			Carmine.add =function(a,b){
				return a+b;
			}

局部作用域 let

定义常量

//ES6之前，大写字母标识
	var PI='3.14'   //依然可以修改
//ES6，const
    const PI='3.14'  //只读变量

方法

方法就是把函数放在对象的内部。

			var carmine={
				name:'zhouyi',
				birth:1999,
				age: function(){
					//今年-出生年
					var now=new Date().getFullYear();
					return now-this.birth;   //当前调用的对象（carmine）
				}
			}
			//调用方法
			carmine.age();

apply改变this的指向

			var carmine={
				name:'zhouyi',
				birth:1999,
				age: getAge  //只写函数名
			}
            //方法定义在对象外
			function getAge(){
					var now=new Date().getFullYear();
					return now-this.birth;  
			}
			getAge.apply(carmine,[]) //this指向了carmine

特殊对象

Date

			var now=new Date(); //Thu Feb 11 2021 10:43:24 GMT+0800 (中国标准时间)
			now.getFullYear();//年
			now.getMonth();
			now.getDay();//星期几
			now.getDate();//日
			
			now.getTime();//时间戳，全球统一
			var time=new Date(1613011404140);// 时间戳转Date
			
			now.toLocaleDateString();  //本地时区"2021/2/11"
			now.toLocaleString();  //"2021/2/11上午11:05:03"

JSON

(JavaScript Object Notation, JS 对象简谱) 是一种轻量级的数据交换格式。

在JS中一切皆为对象、任何JS类型都可以用JSON来表示；

格式：

  • 对象都用{}
  • 数组都用[]
  • 键值对 都是用 key:value

JS对象与JSON字符串的相互转换

			var person={
				name:"carmine",
				age:21,
				tags:['js','html','css','...']
			}
			//对象转JSON字符串
			//"{"name":"carmine","age":21,"tags":["js","html","css","..."]}"
			var str=JSON.stringify(person);

			//字符串转JSON，里头双引号，外头只能用单引号
			var obj=JSON.parse('{"name":"carmine","age":21,"tags":["js","html","css","..."]}');

JSON和JS对象的区别：

var obj={a:'hello',b:'hellob'};
var json='{"a":"hello","b":"hellob"}' //k-v都有双引号，整体是一个字符串

Ajax

  • 原生的js写法 xhr 异步请求
  • jQuery封装好的方法 $("#name").ajax("")
  • axios 请求

面向对象编程

原型

			var person={
				name:"carmine",
				age:21,
				run: function(){
					console.log(this.name+" running...");
				}
			}
			var xiaoming={
				name:"xiaoming"
			}
			xiaoming.__proto__=person;  //xiaoming的原型是person

class 继承

	//定义一个学生的类 ES6
			class Student{
				constructor(name){
					this.name=name;
				}
				
				hello(){
					alert('hello');
				}
			}
	

			//继承
			class XiaoStudent extends Student {
				constructor(name.grade){
					super(name);
					this.grade=grade;
				}
				grade(){
					alert(this.grade);
				}
			}
			var xiaohong=new XiaoStudent('xiaohong',1);

本质上还是指向原型（原型链：一直查找到Object.prototype）

操作BOM对象（重点）

BOM：浏览器对象模型（内核）

  • IE 6~11
  • Chrome
  • Safari
  • FireFox

三方（不是原生的）：

  • QQ浏览器
  • 360浏览器

window代表 浏览器窗口，有很多的方法获取窗口属性

Navigator封装了浏览器的信息~~（大多数时候不用，因为会被人为修改）~~

navigator.appName
"Netscape"
navigator.appVersion
"5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/88.0.4324.150 Safari/537.36"
navigator.userAgent
"Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/88.0.4324.150 Safari/537.36"

location 代表当前页面的URL信息

host: "www.baidu.com"
hostname: "www.baidu.com"
href: "https://www.baidu.com/"
protocol: "https:"

document 代表当前页面，HTML DOM树

		用户名：<input type="text" id="username"/>
		<script>
		//获取文档树的节点
			var username=document.getElementById('username');
		</script>

document.title可以获取title

document.cookie可以获取cookie，但不安全，cookie可以被劫持

eg：淘宝登陆后，天猫获取cookie同样可以登录天猫，如果被劫持，账号安全会有影响。

​ 解决方法：服务器端可以设置cookie：httpOnly

history 浏览器的历史记录

history.back()/history.forward()

操作DOM对象（重点）

DOM：文档对象模型。浏览器网页就是一个Dom树形结构！

每个标签就是一个Dom节点，先要获取这个Dom节点。

获得DOM节点

			//对应CSS选择器
			var h1=document.getElementsByTagName('h1');
			var p1=document.getElementById('p1');
			var p2=document.getElementsByClassName('p2');
			
			var father=document.getElementsByClassName('father');
			var children=father.children;//获取父节点下的所有子节点

更新节点

      		//修改文本的值（会覆盖）			
			p1.innerText=123
			//可以解析HTML文本，自动转义，而Text不会
			p1.innerHTML='<strong>123</strong>'
			//修改Style
			p1.style.color='red'
            p1.style.fontSize='20px'
            p1.style.padding='10px'

删除节点

删除节点的步骤：先获取父节点，再通过父节点删除自己

		<div class="father">
			<h1>标题</h1>
			<p id="p1">p1</p>
			<p class="p2">p2</p>
		</div>
		<script>
			var p1=document.getElementById('p1');
            var father=p1.parentElement;//获取父节点
            father.removeChild(p1);//删除p1

			//删除多个结点
			father.removeChild(father.children[0]);
			father.removeChild(father.children[0]);//删除第二个，动态变化
		</script>

插入节点（也可自己创建）

		<p id="js">js</p>
		<div id='list'>
			<p id="se">JAVASE</p>
			<p id="ee">JAVAEE</p>
			<p id='qe'>qe</p>
		</div>
		<script>
			var list=document.getElementById('list');
			var js=document.getElementById('js');
			list.appendChild(js);//追加，不会覆盖
			//insertBefore(newNode,targetNode)
			list.insertBefore(js,ee);
		</script>

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-vxoSuYqv-1613226261996)(C:\Users\13611\AppData\Roaming\Typora\typora-user-images\image-20210212115115569.png)]

创建标签

			var newP=document.createElement('p');//手动创建p标签
			newP.id='newP';
			newP.innerText='Hello,carmine';//文本
			list.appendChild(newP);

用DOM对象创建style样式

			//创建一个标签节点
			var myStyle=document.createElement('style');//创建了一个空的style标签
			myStyle.setAttribute('type','text/css');
			myStyle.innerHTML='body{background-color: red;}';//设置标签内存
			//放置Style
			document.getElementsByTagName('head')[0].appendChild(myStyle);

操作表单（验证）

表单的目的：提交信息

方法一：按钮点击，获得要提交的信息

	<body>
		<form action="post">
			<span>用户名：</span> <input type="text" id="username"/>
			<p>
				<span>性别：</span>
				<input type="radio" name="sex"  value="man" id="boy"/>男
				<input type="radio" name="sex"  value="woman" id="girl" />女
			</p>
		</form>
		
		<script>
			var input_text=document.getElementById('username');
			//修改文本输入的值
			input_text.value='123';
			
			var boy_radio=document.getElementById('boy');
			var girl_radio=document.getElementById('girl');
			//选中girl单选框
			girl_radio.checked=true;
		</script>
	</body>

方法二：提交表单，MD5加密 优化表单

	<body>
		<!--表单绑定提交事件
			onsubmit=绑定一个提交检测的函数，true false
			将这个结果返回给表单，使用onsubmit接收！
		-->
		<form action="https://www.baidu.com/" method="post"  onsubmit="return test()">
			<span>用户名：</span> <input type="text" id="username" required/> <br />
			<span>密码：</span> <input type="password" id="password" required/>
			<input type="hidden"  id="md5-password" name="password"/>

			<!--submit提交-->
			<button type="submit">提交</button>
		</form>
		
		<script>
		
			//绑定事件,触发test（）中的代码
			function test(){
				var username=document.getElementById('username');				
				var password=document.getElementById('password');
				var md5_password=document.getElementById('md5-password');
				//MD5算法处理
				//password.value=md5(password.value) 避免直接处理，会突然边长
				//解决方案：引入hidden标签
				md5_password.value=md5(password.value);
				
				//校验判断表单内容，true就是同意提交，false拒绝提交
                if(...密码错误)  return false;
				return true;
			}
			
		</script>
	</body>

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-9kBlV7bq-1613226261998)(C:\Users\13611\AppData\Roaming\Typora\typora-user-images\image-20210212171736135.png)]

JQuery

封装了大量JS方法的的库，公式：$(selector).action()

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<!--百度cdn引入-->
		<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
	</head>
	<body>
		<a href="" id="test-jquery">点我</a>
		
		<!--公式：$(selector).action()-->
		<script>			
			$('#test-jquery').click(function(){
				alert('hello,jQuery');
			})
		</script>
	</body>
</html>

选择器

		//选择器（支持CSS各种）
		$('p').click();   //标签
		$('#id').click();  //id
		$('.class').click();  //类

开发工具站：https://jquery.cuishifeng.cn/

事件

鼠标事件，键盘事件，其他事件

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-6KbTN6Eu-1613226262000)(C:\Users\13611\AppData\Roaming\Typora\typora-user-images\image-20210212191357719.png)]

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
		<style>
			#divMouse{
				width: 500px;
				height: 500px;
				border: 1px solid red;
			}
		</style>
	</head>
	<body>
		<!--获取鼠标当前坐标-->
		mouse: <span id="mouseMove"></span>
		<div id='divMouse'>
			在这里移动鼠标试试
		</div>
		
		<script>
			//当网页元素加载完毕之后，响应事件
			$(document).ready(function(){   //可以简写成 $(function(){})
				$('#divMouse').mousemove(function (e){//获取鼠标坐标e
					$('#mouseMove').text('x:'+e.pageX+' y:'+e.pageY) //显示在span
				})
			})
		</script>
	</body>
</html>

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-h7lS75UO-1613226262001)(C:\Users\13611\AppData\Roaming\Typora\typora-user-images\image-20210212192433986.png)]

操作Dom

//节点文本操作
//document.getElementById()

$('#test-ul li[name=python]').text();//获得
$('#test-ul').html();

$('#test-ul li[name=python]').text('设置值'); //设置
$('#test-ul').html('<strong>123</strong>');

//css操作
$('#test-ul li[name=python]').css("color","red");
//元素隐藏，本质display：none
$('#test-ul li[name=python]').hide();
//其他测试
$(window).width()
$(document).text()

//ajax
$.ajax({
   type: "POST",
   url: "some.php",
   data: "name=John&location=Boston",
   success: function(msg){
     alert( "Data Saved: " + msg );
   }
});

总结

练习小技巧：小游戏源码（JS）、扒别人的前端（HTML、CSS修改看效果）

组件：Lay UI、Elememt UI、Bootstrap、Ant Design

Carmine逸
关注
  • 2
    点赞
  • 踩
  • 20
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
三天速成前端
weixin_42175197的博客
06-26 1429
第一天 下载vscode 安装插件Live Server 新建文件 记住12个标签 html、title、body、head、p、em、s、br、botton、h1—h6 、ul、oi、li 引入CSS标签style，selector、property、value color background font-family boder:none\ 圆角： border:2px sol...
revit教程三天速成光盘说明共1页.pdf.zip
11-22
本“Revit教程三天速成光盘说明”旨在帮助初学者快速掌握Revit的核心功能与操作流程，通过三天的高强度学习，使用户能够在短时间内提升Revit技能。 Revit的核心特点在于其参数化设计，这意味着用户创建的每个模型...
三天学会HTML5 之第一天
01-29 176
引言 HTML5 一直是非常热门的话题，因此此系列文章主要从一些基本功能开始讲起，逐步深入了解HTML5的新概念。 首先了解一些基本的术语和概念。 SGML, HTML,XML三者之间的区别 Doc类型是什么 HTML5 有什么新特点新优势。 学习HTML5 在开始之前首先来区分SGMC，HTML,XML 三者的概念。 SGML 即 Standard ...
三天速成前端——HTML
weixin_43772228的博客
02-08 231
HTML WC3标准： 结构化标准语言（HTML、XML） 表现标准语言（CSS） 行为标准（DOM、JAVAScript） 基本结构 <html> <!-- 头部 --> <head> <!-- meta描述标签，用来描述我们网页的一些信息 --> <!-- 一般用来写SEU --> <meta charset="utf-8"> <meta names="keywords" content="HTML"
三天学会Web前端开发
weixin_45393893的博客
09-25 114
三天学会web前端开发，实现你的高新梦，
前端速成（自用）
wildhd的博客
04-28 143
第一章
香港科技大学TensorFlow三天速成课件
10-10
香港科技大学发布的极简 TensorFlow 入门教程。第一天先介绍了深度学习和机器学习的潜力与基本概念。第二天详细地讨论了卷积神经网。第三天详解了循环神经网络。
前端速成技巧：从菜鸟到高手的必经之路
最新发布
05-27
### 前端速成技巧：从菜鸟到高手的必经之路 在现代软件开发领域中，前端技术占据了举足轻重的地位。无论是网站还是移动应用，良好的用户体验往往取决于前端技术的应用水平。对于想要快速入门并提升前端技能的学习者...
前端三件套之JS速成
qq_62102968的博客
02-23 1660
目录 什么是JS JS的编码方式 内部样式 外部样式 行内样式 JS的输入输出 1:输入 2:输出 变量 运算符 逻辑结构 循环结构 数组 函数 什么是JS js是JavaScript的简称，但是要注意，JS和Java是两种不同的编程语言。 还是那句话：把前端三件套比作一个人，那么，html就是人的骨头框架，css就是衣服裤子等装饰物，JavaScript就是给人编辑各种动作 既然是编辑动作了，那JS自然就少不了人机互动。例如像C语言的输入输出等等 JS是类似于C语
前端学习前三天总结
w2515543429的博客
07-27 381
前端学习前三天总结 作为一个刚开始接触前端的非计算机专业学生，我觉得入门不是一件难事，主要还是靠多练习来提高自己的能力。以下是这几天学习内容的总结。 1.在开始敲代码之前先学习一些快捷键的使用，对于我这样之前敲代码较少的人来说除了打字速度慢，不会快捷键的使用也超级影响学习速度，以下是一些写H5较为常用的快捷键（针对windows系统） Tab:代码补全（比如输入p字母，一按 Tab...
小白三天js基础部分学习——ECMAscript笔记
zxdznyy的博客
09-28 367
文章目录javascript是什么知识储备分块学习一，js与html的结合方式1.1 js代码的书写块1.2 两种与html文档结合的方法1.2.1 内部结合1.2.2 外部结合二，注释三，变量与数据类型3.1 数据类型3.2 变量的定义3.3 typeof()函数 javascript是什么 JavaScript 是世界上最流行的脚本语言，简称js。 JavaScript 是属于 web 的语言，它适用于 PC、笔记本电脑、平板电脑和移动电话。 JavaScript 被设计为向 HTML 页面增加交互性。
教你0基础，速成web前端
岩浆李的游鱼
07-12 2027
前言： 今年公司没什么移动前端的活，闲来无事，我也学习起了前端。从我的博客上也能看出端倪。看到掘金在搞征集好文的活动，我也来参加下。就来分享一下我学习前端的路线吧。（目前我接触了2-3个月了。vue框架，加上原生写官网已经算是成功入门了。希望能帮助想学习前端的同学） 接下来，详细说说我的步骤。它来了。 一、准备工作 打开百度，搜索菜鸟教程，把以下几处过一遍。当然了，重点是过一遍，其中你觉得感兴趣的可以好好看看。以后正式写的时候，不懂就来查。当然你又有空的时候还可以来过一遍。第二次过一遍的时候重点是就像读书时
前端速成教程（HTML、CSS、JS、Vue…）
Hyperplasma
05-06 2336
JavaWeb开发 SSM框架基础 前端速成——HTML、CSS、JS、Vue、Ajax、前端工程化。Web技术教程：W3Schoo。Vue是一套前端框架，免除原生JavaScript中的DOM操作，简化书写。基于MVVM（Model-View-ViewModel）思想，实现数据的双向绑定，将编程的关注点放在数据上。Vue-cli是Vue官方提供的一个脚手架，用于快速生成Vue项目模板。
6周学习计划，攻克JavaScript难关(React/Redux/ES6 etc.)
weixin_30645617的博客
11-06 452
作者：余博伦链接：https://zhuanlan.zhihu.com/p/23412169来源：知乎著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。 和大家一样，最近我也看了Jose Aguinaga写的How it feels to learn JavaScript in 2016. 显然这篇文章击中了人们的痛处。它在Hacker News上排了不止一次第一。同样也是/...
零基础学前端之HTML 速成【学习笔记】
li520_fei的博客
01-10 637
【前端总路线学习笔记】 文章目录HTML 速成【学习笔记】1. 学习准备2. 什么是HTML3. HTML编写入门4. 块级元素和内联元素5. 的使用6. 列表7. 表格8. 表单9.图片10.引用(别人说过的话)11. 按钮 button 还有 abbr 和 HTML 速成【学习笔记】 1. 学习准备 浏览器 Google Chrome Mozilla Firefox Safari Edge 编辑器 Visual Studio Code Sublime Text Atom.io 不想下载
前端三大件速成 01 HTML
weixin_42830015的博客
04-18 1340
前端三大件速成 01 HTML
前端速成日记一：购物网页
m0_53394907的博客
06-12 1701
我这个购物网页任务是进入工作室的考核，关于前端这门课是下学期才开设的，所以到我接到这个任务即是开心也有点担忧，给我的时间只有10天，而且一周我还有30节课，C#和计算机网络的作业也特别多，我之前从未接触过前端的制作，使我感到新鲜和担心，好在我在B站找到了黑马pink老师的课程，使我快速了解前端的最基础和简单的知识，在外加我获得了小组中其他同伴的帮助才使得我这次任务能够正常完成。.........
前端基础速成day01--总体介绍
_web_Z的博客
11-30 326
前端发展史 前端开发： 用技术实现用户界面（site or app）+ 数据交互 技术： HTML+ CSS+ JS +框架 拿数据 + 静态界面 ----》 用户界面 web1.0 时代 静态 用户只能阅读者 没有交互 web2.0 js 交互 web3.0 node.js 大前端时代 左侧第5个图标 扩展 搜索一下两个插件 右下角 install 安装即可 chinese汉化 view in broswer 查看 关闭 重新打开！！！ 把 自动保
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值