javascript入门

最新推荐文章于 2024-07-22 15:13:59 发布
最新推荐文章于 2024-07-22 15:13:59 发布
阅读量680 收藏
点赞数
分类专栏： javascript 文章标签： javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u010713277/article/details/51049511
版权

JavaScript

一、 JavaScript概述

1、 JavaScript是什么，有什么作用？（了解）

*JavaScript是因特网上最流行的脚本语言。

*脚本语言不能单独使用，必须嵌入到其他语言中组合使用

*JavaScript不能单独使用，必须和其他语言（HTML）结合使用

*浏览器解释执行

 

*作用是：可以控制前端页面的逻辑操作

 例如：JS可以控制CSS的样式；（一般）

JS可以对表单项进行校验（重点）

JS可以对HTML元素进行动态控制（使用较多）

 

*特点： 

  安全性（没有访问系统文件权限，无法用来做木马病毒）

  跨平台性（浏览器有JS的解析器，只要有浏览器就能运行JS代码，和平台无关）

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>demo1.html</title>
	
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->

	<script type="text/javascript">
		var sum=0;// int sum=0;
		for(var i=1;i<=9;i++){// int i=1;
			sum+=i;
			alert(sum); //System.out.print(sum);
		}
		
	</script>
  </head>
  	
  <body>
    	
    	
  </body>
</html>


2、 JavaScript和Java的关系（了解）

ECMAScript

*JavaScript和Java一点关系都没有（雷锋和雷峰塔）

*JavaScript和Java的区别：

>JavaScript代码可以直接在浏览器执行，而Java必须先经过编译才能执行

>JavaScript是弱类型语言，Java是强类型语言

强类型语言：要求变量的使用严格符合定义。（例如：变量声明后都有一个固定的区域，int区域大小是32位）。编程时痛苦，调BUG时舒服

弱类型语言：不要求变量的使用严格符合定义。（例如：变量声明后没有一个固定的区域，任何类型的值都能放在该区域）。编程时舒服，调BUG时痛苦

 

<html>

  <head>

<script>

  var sum = 0;

  for(var i = 1; i <= 100; i++) {

      sum += i;

}

alert(sum);

</script>

  </head>

  <body>

  </body>

</html>

 

二、JavaScript语法及使用(重点)

注释

*单行注释

//

Myeclipse快捷键 ctrl+shift+c

*多行注释

/* */

Myeclipse快捷键 ctrl+shift+/

变量

*标示内存中的一块空间，用于存储数据，数据是可变的

 

*格式：

 var 变量名 = 变量值;

 

 JavaScript中的变量声明都用var关键字

 变量值的数据类型（原始数据类型和引用数据类型）

>原始数据类型:

string 字符串类型

“”和’’都表示字符串

 

boolean 布尔类型

 true,false

 

number 数字类型

整数和小数

null 空，表示引用类型的对象不存在

 

undefined 未定义

变量声明未赋值时使用/对象的属性未赋值时使用

注：变量就像一个盘子，什么都能盛装。

变量的类型可以用typeof()来判断。例如:var str=”aa”;alert(typeof(str));//string

变量的大小写是敏感的，yy和YY不是一个变量。

为什么 typeof 运算符对于 null 值会返回 "Object"。这实际上是 JavaScript 最初实现中的一个错误，然后被 ECMAScript 沿用了。现在，null 被认为是对象的占位符，从而解释了这一矛盾，但从技术上来说，它仍然是原始值。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>demo1.html</title>
	
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->

	<script type="text/javascript">
		/* 
			var 变量名=变量值;
		
			原始数据类型：
			string	字符串
					""  ''都表示字符串
					
			boolean	布尔类型
					true , false
					
			number	数字
					整数和小数
			
			null	空，对象为空（引用为空）
			
			undefined	未定义  变量没有赋值就使用/使用 对象.属性 的时候，属性没有赋值就使用
			
			//变量就是一个盘子，装什么东西都可以
			
			引用数据类型：
			typeof()  帮咱们判断变量是什么类型的
			
			变量名命名是大小写敏感的（区分大小写）
		*/
		/* var str = "aa";
		var str2 = 'aa';
		var str3 = true;//false
		var str4 = 15;
		var str5 = 15.55;
		var date = null;
		var aa;
		str =15;
		str = true;
		str = "aa";
		
		alert(str);//aa 15 */
		
		/* var str = "aa";
		str =15;//number
		//str = true;//boolean
		var ss;
		var obj= null;
		alert(typeof(obj)); */
		
		/* var sf="aa";
		alert(Sf); */
		
		/* 
			引用数据类型
			
			常用对象：
			String,Array,Date,Math,RegExp
			
			Object 所有对象的父对象
			
			
		*/
		var date = new Date();
		alert(date instanceof Object);
	</script>
  </head>
  	
  <body>
    	
    	
  </body>
</html>

 


>引用数据类型（了解）

即对象

例如：var obj = new Object();

 

常用对象：

String,Array,Date,Math,RegExp

 

注：instanceof可以用来判断对象是否属于某类型。返回true和false .例如：

Var str = new String();

Alert(str instanceof String);//true

 

 

*两种变量：

>全局变量

就是在<script>标签中定义的变量，在整个页面都有效

>局部变量

就是在函数体内定义的变量 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>demo1.html</title>
	
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->

	<script type="text/javascript">
		/* 
			全局变量
			就是在script标签中的变量，对整个页面都有效
		
			局部变量
			就是在函数体中定义的变量
		*/
		/* var str =10;
		
		for(var i=1;i<=3;i++){
			
		}
		alert(i);//4 */
		
		/* function aa(){
			var a=5;
			alert(a);
		} */
		var x = 4;
		function show(x){
		x = 8;
		}
		show(x);
		alert("x = "+x);
		/* A.8   
		B.4   
		C.undefined */

	</script>
  </head>
  	
  <body>
    	
    	
  </body>
</html>

 

练习：如下代码显示X值是多少？

var x = 4;

function show(x){

x = 8;

}

show(x);

alert("x = "+x);

 

A.8   

B.4   

C.undefined

 

函数（方法）

*用于代码封装，提高复用性

 

*格式 function 函数名(参数列表){

函数体;

return ;

}

*函数定义，关键字 function

*定义参数列表时，不必使用var关键字，否则报错

*如果没有需要返回的参数，return可以不写

*函数需要调用才能执行，和Java一样。

*JavaScript不存在重载形式：

>每个JavaScript中，都存在一个数组arguments，用于存储参数列表

思考：如下调用方法会打印输出什么效果？

function getSum(){

return 100;

}

var sum = getSum;

alert(sum);

 

A. 100

B. undefined

C. function getSum(){return 100;}

 

*如果调用方法时忘记加()，那么会把函数对象的引用传给变量

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>函数.html</title>
	
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
	<script type="text/javascript">
		//用来做加法的方法  a b  a+b
		
		/* public int sum(int a,int b){
			return a+b;
			
		} */
		//JavaScript不定义返回值的类型
		//javascript 方法不存在重载
			//因为在JavaScript方法中存在arguments隐藏对象（数组），就是用来获取传进来的参数列表的
		//JavaScript中如果调用方法不加括号，那么会把方法（对象）的引用传出来
		/* function sum(a,b){
			alert(arguments.length);
			alert(arguments[0]);
			alert(arguments[1]);
			alert(arguments[2]);
// 			alert(a);
// 			alert(b);
		}
		sum(5,6,7); */
		function getSum(){
			return 100;
		}
			var sum = getSum;
			alert(sum);

	</script>
  </head>
  	
  <body>
    
  </body>
</html>

 

*两种扩展函数：

>动态函数（了解会用）

通过JS的内置对象Function来动态创建

格式： new Function(参数一,参数二);

参数一是函数形参列表

参数二是函数体

 

>匿名函数（较常用）

没有名称的函数，函数的简化形式

格式：var str = function(参数列表){

函数体;

return;

};

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>demo1.html</title>
	
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->

	<script type="text/javascript">
		/* 
			动态函数(使用比较少)
				Function 对象
			匿名函数
		
		*/
		/* var par = "a,b,c";
		var par2 = "return a+b+c";
		var str =new Function(par,par2);
		alert(str(1,2,3)); */
		
		var str=function(a,b){
			return a+b;
		};
		alert(str(1,2));
	</script>
  </head>
  	
  <body>
    	
    	
  </body>
</html>

 

   

运算符

算术运算符（常用）

+号除了运算外，可以作为连接符

-号除了运算外，可以作为转换符

 

alert(true + 1); // 2

比较运算符（常用）

== 比较值

=== 又比较值和类型语句（流程控制语句）

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>demo1.html</title>
	
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->

	<script type="text/javascript">
		/* 
			算术运算符
			+	连接符
			-	转换符
			
				NaN意思是不是数字
			比较运算符
			==	只是比较值，即使类型不同也没关系
			===	不仅比较值，也同时比较类型
			
		*/
		/* var str=15;
		var str2="1";
		alert(str+str2);//151 */
		/* var str =15;
		var str2 = "1";
		alert(str-str2);//14 151 */ 
		/* var str= 15;
		var str2="a";
		alert(str-str2);//NaN */
		/* var str=8;
		//alert(str==8);//true
		//alert(str=="8");//true
		alert(str===8);//true
		alert(str==="8");//false */
		/* var str = (8==8)?8:0;
		alert(str); */
		
	</script>
  </head>
  	
  <body>
    	
    	
  </body>
</html>

流程控制语句

对程序运行流程控制的表达式

n 判断语句

IF

if(8 == num){

赋值的问题，需要注意。

}else{

}

0、-0、null、""、false、undefined 或 NaN，为false

否则为true 

和Java中一样。

switch(n)

   {

   case 1:

     执行代码块 1

     break

   case 2:

     执行代码块 2

     break

   default:

     如果n即不是1也不是2，则执行此代码

   }

练习：以下代码输出结果为：

var a=15;

if(a=15){

 alert(15);

}else{

 alert(“else”);

}

A. 15

B. Else

 

n 循环语句

 

For循环（较常用）

for(var i=0;i<=8;i++){

// 循环体

}

增强FOR循环（不灵活，使用少，但开发中会有使用）（了解会用，工作中自己进行尝试即可）

for(变量 in 对象){

// 循环体

}

*里面的变量代表下标

*使用 in关键字

*遍历数组（或对象），里面要用数组[下标]

* 例如：

Var s= new Array();

s[0]=1;

s[1]=2;

for(x in s){

alert(s[x]);

}

 while(表达式){

// 循环体

}

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>demo1.html</title>
	
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->

	<script type="text/javascript">
		/* 
			判断语句
			IF
			0、-0、null、""、false、undefined 或 NaN，为false
			否则为true 
			
			FOR循环	var 
					99乘法表
			while do while
				
			增强for
		*/
		/* function str(){
			return null;
		}
		var x=8;
		var aaaa=str();
		if(aaaa){
			alert(1);//1
		}else{
			alert("else");
		} */
		/* for(var i=0;i<3;i++){
			
		} */
		/* if(-0){
			alert(1);
		}else{
			alert("eeee");
		} */
		
		var i=new Array();
		i[0]=1;
		i[1]=2;
		for(x in i){
			alert(i[x]);
		}
	</script>
  </head>
  	
  <body>
    	
    	
  </body>
</html>



对象

l String对象（了解会用）

* var str = "abc";

* var str = new String("abc");

* 属性：length 字符串的长度

* 方法

* 和java中String对象类似的方法（基本相同，需要练习）

* charAt(index) 返回指定位置的字符（常用）

* indexOf(searchvalue,fromindex) 检索字符串

* lastIndexOf() 从后向前的

* replace() 替换字符串（较常用）

* substring(start,stop) 从哪开始，到哪结合（包含开始不包含结束）

* substr(start,length) 从哪开始，截取长度

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>demo1.html</title>
	
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->

	<script type="text/javascript">
		/* 
			String对象
			
			var s = new String("aaa");
			var s = "aaa";
			
			document.write();//会把值输出到浏览器页面上
		*/
		/* var str ="abc";
		var str2 ="你好么";
		document.write(str2.blink());
		document.write(str2);
		document.write(str.charAt(1)); */
		var str = "ABC";
		document.write(str.toLowerCase());
		
	</script>
  </head>
  	
  <body>
    	
    	
  </body>
</html>


l Array对象（重要）

* js的数组

* var arr = [1,2,3];

*var arr = new Array();数组长度默认为0

* var arr = new Array(4); 数组长度是4

* var arr = new Array(1,2); 数组元素是1,2

* 数组的长度

* length

* 数组的长度是可变的

* 数组元素可以是任意类型（注意）

* 方法

* concat() 链接数组或者元素都可以（较少）

* join(separator) 转化成字符串

* push() 向末尾添加一个元素，返回新的长度

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>demo1.html</title>
	
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->

	<script type="text/javascript">
		/* 
			Array对象
			var str = [1,2,3]; 长度是3，长度可变
			var str = new Array();长度默认是0，长度可变
			var str = new Array(5);长度默认是5，长度可变
			var str = new Array(1,2);长度是2，长度可变
			
			join(分隔符)  默认是 
			push   就是把元素添加进数组末尾
		*/
		/* var str=[1,2,3];
		var str2=[4,5,6];
		alert(str.concat(str2)); */
		
		/* var str2=[1,2,3];
		var str=str2.join();
		alert(str); */
		var str2=[1,2,3];
		var str=5;
		str2.push(str);
		alert(str2);//
		
		
	</script>
  </head>
  	
  <body>
    	
    	
  </body>
</html>


l Date对象（比较常用）

* var date = new Date(); 当前的时间

* toLocaleString() 根据本地的日期格式转化成字符串（了解）

* getDate() 返回一个月中的某一天（了解）

* getMonth() 获取月份（0-11）（了解）

* getFullYear() 获取年（了解）

* getTime() 获取毫秒数（比较重要）

* setTime() 通过毫秒数设置日期（比较重要）

同时也可以通过构造器设置  new Date(毫秒数);

* Date.parse(datestring) 解析字符串，返回毫秒数（重要的）

* 2015-4-29 解析不了

* 2015/4/29 是可以解析的

l Math对象（了解）

round(x) 四舍五入

random() 随机生成0~1数字

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>demo1.html</title>
	
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->

	<script type="text/javascript">
		/* 
			Date对象
			var aa = new Date();
		*/
		var aa = new Date();
// 		alert(aa.toLocaleDateString());
		/* alert(aa.getDate());
		alert(aa.getMonth());
		alert(aa.getFullYear()); */
		/* var long1 = aa.getTime();
		var long2=long1-(1000*60*60*24);
		
		aa.setTime(long2);
		alert(aa.toLocaleString()); */
		
		var bb = Date.parse("2015/5/21");
		//aa.setTime(bb);
		var cc = new Date(bb)
		alert(cc.toLocaleString());
	</script>
  </head>
  	
  <body>
    	
    	
  </body>
</html>


l RegExp对象（重要）

*正则对象     正确的规则

* var reg = new RegExp("表达式"); （开发中基本不用）

* var reg = /^表达式$/ 直接量（开发中常用）

直接量中存在边界，即^代表开始，$代表结束

* test(string) （经常使用）符合规则返回true，不符合返回false

例如：

if(reg.test("12345")){

//

}else{

//

}

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>demo1.html</title>
	
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->

	<script type="text/javascript">
		/* 
			RegExp对象
			var s = new RegExp("表达式");
			var s = /^表达式$/;
			
			test()
		*/
		var reg = /^\s*$/;//验证空
		var checkText = "";
		alert(reg.test(checkText));
		
	</script>
  </head>
  	
  <body>
    	
    	
  </body>
</html>

练习：判断字符串是否为空

var msg=””;

var reg = /^\s*$/;

alert(reg.test(msg));

 

 

l 全局函数

Global

浏览器内存中游离的函数，直接拿过来用。

eval() 可以解析字符串，执行里面的javascript的代码（学习JSON）（最常用）

isNaN() 是否 不是 数字  （常用）

encodeURI() 编码

decodeURI() 解码

（不用看）escape不编码字符有69个：*，+，-，.，/，@，_，0-9，a-z，A-Z

（了解）encodeURI不编码字符有82个：!，#，$，&，'，(，)，*，+，,，-，.，/，:，;，=，?，@，_，~，0-9，a-z，A-Z

（了解）encodeURIComponent不编码字符有71个：!， '，(，)，*，-，.，_，~，0-9，a-z，A-Z

 

三、JavaScript和HTML的结合方式（了解）

 

l 两种使用方式

>内部使用

*<script type=”text/javascript”>JavaScript的代码</script>

>外部引用

*<script type=”text/javascript” src=”javascript文件路径”></script>

*外部引用时script标签内不能有script代码，即使写了也不会执行

 

注意：<script>标签写在任意地方都可以，但是要注意HTML和JAVASCRIPT的加载顺序

<body οnlοad=””> 在网页加载完毕后 做什么事

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>demo1.html</title>
	
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->

	<script type="text/javascript" >
		function aa(){
			alert(document.getElementById("a").innerHTML);//打印 你好啊
			alert("1");
			alert("2");
		}
		
		
	</script>
  </head>
  	
  <body οnlοad="aa();">
    	<span id="a">你好啊</span>
    	
  </body>
</html>

 

四、JavaScript的组成(了解)

JavaScript的组成

*ECMAScript (核心)

*DOM 文档对象类型

*BOM 浏览器对象类型

 

 

 

 

 

 

 

 

 

 

 

练习：

1、99乘法表

2、2015-01-01到2015-09-01有多少天

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

1、答案

<script type="text/javascript">

   for(var i=1;i<=9;i++){

   for(var j=1;j<=i;j++){

   document.write(j+"*"+i+"="+j*i+"\t");

   }

   document.write("<br/>");

   }

  </script>

 

2答案：245

<script type="text/javascript">

   var dlong1=Date.parse("2015/01/01");

   var dlong2=Date.parse("2015/09/03");

   alert((dlong2-dlong1)/1000/60/60/24);

  </script>

 

机会留给准备的人
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
基本数据类型和引用数据类型的区别和变量及作用域(函数和变量)
04-22 306
基本类型和引用类型的值 ECMAScript 变量可能包含两种不同的数据类型的值：基本类型值和引用类型值。 基本类型值指的是那些保存在栈内存中的简单数据段，即这种值完全保存在内存中的一个位置。 而引用类型值则是指那些保存在堆内存中的对象，意思是变量中保存的实际上只是一个指针，这个指针指向内存中的另一个位置，该位置保存对象。 将一个值赋给变量时，解析器必须确定这个值是基本类型值，还...
JavaScript
Vridis_h的博客
08-16 262
* JAVASCRIPT（JavaScript简写js，文件的后缀名也是  demo.js）（*****） * javascript的简介 * js是基于对象和事件驱动的脚本语言，作用在客户端（浏览器）上。 * js的特点： * 交互性 * 安全性：（不可以访问本地的硬盘） * 跨平台性：因为浏览器就可以解析js的文件。 * javascript和java不同（一点关系没有）
JavaScript入门
03-04
JavaScript是一种广泛..."JavaScript入门"这个主题覆盖了这些基础，从零开始带你走进JavaScript的世界。在"JavaScript-Beginner-main"这个压缩包文件中，可能包含了相关的教程、练习案例或项目，帮助你巩固这些知识。
JavaScript 入门 新手学习笔记
11-17
这篇"JavaScript入门新手学习笔记"提供了全面的学习资源，适合初学者系统性地掌握这一技术。 笔记可能包含了以下关键知识点： 1. **基础语法**：JS的基础包括变量（var、let、const）、数据类型（如字符串、数字、...
Javascript 入门基础学习
10-29
这只是JavaScript入门的基础知识，随着学习的深入，你还将接触到函数、对象、数组、事件处理、DOM操作、异步编程（如Ajax）以及更多的高级特性。理解并掌握这些概念，你就能创建出丰富交互性的网页应用。继续学习和...
Vue 3 和 SpringBoot 实现文件分片上传示例
exlink2012的专栏
07-22 242
实现分片上传，并使用Spring Boot在后端保存文件。前端将文件分片并逐个上传到后端，后端接收到所有分片后再进行合并，最终保存为一个完整文件。
VUE中的重点*
最新发布
qq_61132537的博客
07-22 463
实际上就是一个闭包，因为vue是单页面应用，是由很多组件构成，每一个组件中都有一个data， 所以通过闭包给每一个组件创建了一个私有的作用域，这样就不会相互影响。
jquery-选择器常见用法
随笔
07-18 205
jquery-选择器，对象下有多个子元素时如何选择
Vue3企业级项目开发实战课-笔记记录
tuku0801的专栏
07-20 930
实践 Vue 3 自研组件库开发、Node.js 服务端开发、Vue 3 结合 Node.js 的全栈项目开发以及全栈项目的单元测试等大厂常见的项目技术场景
vue3 vxe-grid修改currentPage，查询数据的时候，从第一页开始查询
jwbabc的专栏
07-18 239
vxe-grid查询数据的时候，从第一页开始查询，并且清空选中，清空复选框状态等，查询数据查询。
HOW - SVG 图标组件封装（Lucide React）
weixin_58540586的博客
07-18 1206
在中我们介绍过 “动态 Fetch CDN SVG 图标”，这种在开发者将需要用到 图标 依次上传到 CDN 再在项目通过请求引入使用的场景。但其实，更常见的做法还是统一维护一组 SVG 图标，然后将其封装成组件，直接在项目中通过 Import 的形式使用。
web前端 React 框架面试200题（三）
柯晓楠
07-21 403
纯组件是可以编写的最简单和最快的组件。它们可以替换任何只有 render() 的组件。这些组件增强了代码的简单性和应用程序的性能。Context 通过组件树提供了一个传递数据的方法，从而避免了在每一个层级手动的传递 props 属性在JSX表达式中，一个开始标签(比如)和一个关闭标签(比如)之间的内容会作为一个特殊的属性props.children被自动传递给包含着它的组件。
VUE项目中使用crypto.getRandomValues代替Math.Random
07-18 34
由于 Math.random() 的底层算法是公开的（xorshift128+ 算法），V8 源码可见，因此，是可以使用其他语言模拟的，这就导致，如果攻击者知道了当前随机生成器的状态，那就可以知道缓存中的所有随机数，那就很容易匹配与破解。为了保证足够的性能，Math.random()随机数并不是实时生成的，而是直接生成一组随机数（64个），并放在缓存中，当这一组随机数取完之后再重新生成一批，放在缓存中。crypto这个对象在目前的浏览器中大多都默认加载了，所以可以使用公共函数方式来引用和使用。
vue3 vxe-grid查询有返回数据，但是不显示的问题解决
jwbabc的专栏
07-18 317
vxe-grid，方法是调用了，也有返回结果，但是就是不显示的解决。
javaScrip的学习（一）
weixin_65450681的博客
07-19 1259
这篇文章让我们简单来了解一下js，那么什么是js?JavaScript（简称JS）是一种高级编程语言，主要用于为网页添加交互功能。它可以嵌入到HTML页面中，通过对DOM（文档对象模型）的操作来实现动态效果和用户交互。JavaScript由Netscape公司的Brendan Eich于1995年创造，最初是为了增强HTML页面的功能性。随着时间的推移，JavaScript逐渐演变成一种通用的编程语言，可以在浏览器以外的环境中运行，例如服务器端的Node.js。
轮播图变成响应式数据
罗铠威的博客
07-19 174
本篇博客主要记录轮播图变成响应式数据。
【Vue3】响应式数据
又言又语
07-20 406
查看联系方式
vue3前端开发-小兔鲜项目-一级页面banner图渲染
yrldjsbk的博客
07-19 350
其实，首页的banner渲染代码可以拿来复用的，只是区别在于，传递的接口参数不一样而已。我们的一级页面就可以成功拿到了后端接口反馈过来的一级栏目的banner图信息了。我们增加了一个参数对象params.而且做好了默认值的设置。（用的是一种解构赋值的模式）1：改造一下之前的获取banner的接口调用函数，增加一个参数对象。2：把之前HomeBanner.vue里面的代码，拿过来，在template里面新增banner的渲染模块内容。写好默认的值1.（不赋值的情况下，就是这个默认值1）3：修改完善页面内容。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值