1在html中添加js代码的三种方式
Posted xzy不会飞的地板流
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了1在html中添加js代码的三种方式相关的知识，希望对你有一定的参考价值。
1.第一种方式：在时间句柄后太假js代码；
例如浏览器弹出对话框;
1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 2 "http://www.w3.org/TR/html4/loose.dtd"> 3 <html> 4 <head> 5 <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 6 <title>无标题文档</title> 7 </head> 8 9 <body> 10 <!--javascript是基于事件驱动型的编程语言，当发生某个特殊的事件的时候执行一段特殊的程序--> 11 <!--每一个时间都会对应一个事件句柄，事件句柄的名称：on+事件名--> 12 <!--程序员可以在事件句柄后"注册"js代码--> 13 <!--当事件发生时浏览器自动执行事件句柄后的js代码--> 14 <!--window是js中的内置对象，代表整个窗口属于BOM的一员--> 15 <!--window这个内置对象有一个方法，叫做alert,这个方法可以弹出消息框--> 16 <!--JS语句以分号结尾--> 17 <button type="button" onclick="window.alert(‘hello world‘)">请点击我</button> 18 19 </body> 20 </html>
2.第二种:让浏览器弹出对话框也可以把js代码写在独立脚本块中：
1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 2 "http://www.w3.org/TR/html4/loose.dtd"> 3 <html> 4 <head> 5 <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 6 <!-- TemplateBeginEditable name="doctitle" --> 7 <title>无标题文档</title> 8 <!-- TemplateEndEditable --> 9 <!-- TemplateBeginEditable name="head" --> 10 <!-- TemplateEndEditable --> 11 <!--独立脚本块,其中可以编写js代码；独立脚本块既可以放在head中，可以出现在hmtl中的任何位置--> 12 <script type="text/javascript"> 13 //在整个页面加载过程中之上而下的顺序解释执行 14 //并且alert方法具有阻塞作用，只有点击确定后alert方法才算执行完成,页面中才会出现"注册" 15 alert("hello"); 16 </script> 17 </head> 18 19 <body> 20 注册 21 </body> 22 </html>
3.第三种方式:将js文件（专门写js代码)引用到html中
1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 2 "http://www.w3.org/TR/html4/loose.dtd"> 3 <html> 4 <head> 5 <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 6 <title>无标题文档</title> 7 <script type="text/javascript" src="1.js"> 8 9 //这里不能写js代码 10 //alert("你好，世界"); 11 </script> 12 </head> 13 14 <body> 15 注册 16 </body> 17 </html>
4.js中的变量
1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 2 "http://www.w3.org/TR/html4/loose.dtd"> 3 <html> 4 <head> 5 <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 6 <!-- TemplateBeginEditable name="doctitle" --> 7 <title>JS中的变量</title> 8 <!-- TemplateEndEditable --> 9 <!-- TemplateBeginEditable name="head" --> 10 <!-- TemplateEndEditable --> 11 <script type="text/javascript" > 12 13 /* 14 1.什么是变量？ 15 -内存中存储数据的最基本的单元 16 17 2.变量怎么声明？ 18 -java是一种强类型的语言 19 强类型：java语言是由编译阶段，在编译阶段就确定了变量的数据类型 20 例如:int i=10; 21 以上程序通过编译之后，i变量的数据类型从始至终都是int类型，不能将其他数据类型的值赋给i变量。例如：i="abc"; 22 以上程序不能通过编译。 23 这种类型称为强类型； 24 -jsvascript是一种弱类型编程语言 25 弱类型:javascript这种脚本语言，以普通形式保存，不需要编译，直接运行。没有编译期。 26 弱类型的特征：变量的数据类型是可以随意改变。 27 int i=100;//在javascript中不需要这样编写，因为没有编译期了。 28 29 var a=100;//javascript中是这样做的 30 a="abc";//程序执行到此,a为字符串类型 31 a=true;//a为boolear类型 32 a=3.2;//a 为浮点类型 33 -变量声明的语法格式： 34 var 变量名; 35 36 3.变量如何赋值？ 37 变量赋值格式： 38 变量名=值； 39 *重点：js中的变量若没有显示赋值，系统默认赋值undefined；undefined在js中是一个具体的值，表示未定义。 40 41 4.全局变量，局部变量？ 42 js中遵循就近原则，全局变量作用域是整个js程序，局部变量的作用域只是某个函数 43 44 5.一行上可以定义多个变量 45 */ 46 //若没有给变量赋值，系统默认undefined 47 var ename; 48 alert("ename:"+ename); 49 50 //可以赋其他类型的值 51 ename="SMITH"; 52 alert("ename:"+ename); 53 54 ename=100; 55 alert("ename:"+(ename+1)); 56 57 ename=false; 58 alert("ename:"+(ename?"ABC":"DEF")); 59 60 //js中字符串可以使用单引号 61 ename=‘abcdf‘; 62 alert("ename:"+ename); 63 64 //a,b的值都是undefined;c的值为300; 65 var a,b,c=300; 66 67 alert(a); 68 alert(b); 69 alert(c); 70 71 </script> 72 </head> 73 74 <body> 75 76 </body> 77 </html>
以上是关于1在html中添加js代码的三种方式的主要内容，如果未能解决你的问题，请参考以下文章