html作为骨架,css作为装饰,网页页面可以进行建设,但是当网站与用户交互时,就需要一种脚本语言进行沟通,既提升了用户体验,同时也减少了服务器端压力,接下来介绍的第三门语言为JavaScript,一种脚本语言,作为语言方法及操作众多,文章会分为几部分进行介绍,同时也会在文章末给出js的参考链接。在执行本篇代码前,依旧需要在html同文件夹下建立一个js基础语法.js文件。
html:
<html>
<!-- 标签html:内部包含整个HTML页面,所有的设计均在当前的html标签内部进行-->
<head>
<!--整个文件的头部,里面包括一些属性供浏览器识别解析,对用户不可见-->
<title>标题</title>
<!--标签title,说明整个页面的标题,最终显示在浏览器加载页面的标签页-->
<meta http-equiv="content-type" content="text/html;charset=utf-8"/>
<!--告诉浏览器以utf-8的码表进行解码,防止中文乱码,meta标签是无标签体标签,结束在开始标签后加反斜杠,即空标签-->
<meta name="keywords" content="html,展示"/>
<!--展示此网页的关键词,供搜索引擎使用,以“,”分开,其中关键词个数为权重,越多权重越低,一般为3到5个-->
<meta name="description" content="html编程学习"/>
<!--网页描述,展示在搜索引擎的网页的索引页面-->
<script src="js基础语言.js"></script>
<!--引入js文件-->
</head>
<body>
<!--整个文件的体,设计元素在这个部分中,最终展示给用户-->
</body>
</html>
js基础语法.js:
//js,即javascript,前部分介绍了html与css语言,html作为总架构,css作为装饰
//JavaScript则作为与用户交互语言,在服务器端进行一些操作
//js语法体系分为EMCA基础语法(已统一),BOM与DOM编程(未完全统一)
/*
常用函数:alert("")//提示框效果
document.write("")//向html页面中输出内容
js引用方式有两种,第一种使用<script type="text/javascript"></script>标签引用,
第二种是外部调用,使用<script src="js文件路径"></script>导入js文件
*/
var a = 10;
var b = 3.14;
var c = false;
var d = 'a';
var e = "10";
var f = new Object();
document.write(a+";类型:"+typeof(a)+"<br/>");
document.write(b+";类型:"+typeof(b)+"<br/>");
document.write(c+";类型:"+typeof(c)+"<br/>");
document.write(d+";类型:"+typeof(d)+"<br/>");
document.write(e+";类型:"+typeof(e)+"<br/>");
document.write(f+";类型:"+typeof(f)+"<br/>");
/*js有四种数据类型:number boolean string object 但都用var定义 */
//类型转换函数 字符串到整数:parseInt();
// 字符串到小数:parseFloat();//表单接收的都是string类型,比较时number与string可以自动转换
//运算符与流程控制与java语法相同,这里不予以介绍
/*
swtich(){
case 选项:
执行;
break;
case 选项:
执行;
break;
case 选项:
执行;
break;
default:
执行;
break;
}//选项可以为变量或者为表达式,但是java中不支持
*/
/*
for-in语句使用
for(var i in arr){}//可以遍历数组或者对象
*/
/*
with语句可以方便函数的调用,java里没有
with(document){
write();
write();
}
*/
//函数定义:function 函数(形参){语句;}
//函数调用:函数(实参);
function add(a , b){
var result = a+b;
document.write(result+"<br/>");
}
add(10,20);//函数不可以重载,后定义的方法会覆盖之前的方法
//函数中的形参和实参的数量不一致也可以调用,多于NaN,少于后面实参丢弃,因为参数以arguments数组传递,从左到右依次赋值
//内置对象介绍
//Array对象
arr1 = new Array();//定义数组
arr2 = new Array(5);//定义数组个数
arr3 = new Array(1,2,3,4,5);//定义数组内容
document.write(arr1.constructor+"<br/>");//返回数组的属性名称
document.write(arr1.length+"<br/>");//返回数组长度,定义未给值的长度为0
document.write(arr3.concat(arr3)+"<br/>");//连接两个数组并返回结果
arr1[0] = 1;
arr1[1] = 2;
arr1[2] = 3;
document.write(arr1.join()+"<br/>");//将数组所有元素放入一个字符串
document.write(arr3.pop()+"<br/>");//删除并返回最后一个元素
document.write(arr3.push(6)+"<br/>");//向末尾添加元素并返回长度
document.write(arr3.reverse()+"<br/>");//颠倒整个数组
document.write(arr3.shift()+"<br/>");//删除并返回第一个元素
document.write(arr3.unshift(7)+"<br/>");//向开头添加元素并返回长度
document.write(arr3.slice(1)+"<br/>");//第一个数字为起始,第二个为结束,负数表示倒数
document.write(arr3.sort()+"<br/>");//对数组进行排列,顺序以括号内属性为准
document.write(arr3.splice(0,1,8)+"<br/>");//第一个参数删除的位置,第二个参数删除的个数,第三个表示增加的参数
document.write(arr3.toString()+"<br/>");//将数组转化为字符串返回结果
document.write(arr3.valueOf()+"<br/>");//返回数组原始值
//Boolean对象
var a = new Boolean(true);
document.write(a.toString()+"<br/>");//返回对象字符串
document.write(a.valueOf()+"<br/>");//返回对象原始值
//Date对象
var myDate = new Date();
document.write(myDate+"<br/>");//返回日期
document.write(myDate.getDate()+"<br/>");//返回日
document.write(myDate.getDay()+"<br/>");//返回星期
//还可以返回小时,分钟,毫秒等等,文末会给出方法参考链接
document.write(Date.parse(myDate)+"<br/>");//返回1970.1.1午夜至今的毫秒数
document.write(myDate.setDate(2)+"<br/>");//设置时间的某一天,以毫秒显示
//对应get方法有相应的set方法,用以设置时间,文末会有参考链接
document.write(myDate.toString()+"<br/>");//将date转化为字符串
document.write(myDate.toDateString()+"<br/>");//根据date类型将日期部分转化为字符串
document.write(myDate.toTimeString()+"<br/>");//根据date类型将时间部分转化为字符串
document.write(myDate.toUTCString()+"<br/>");//根据世界时间转化为字符串
document.write(myDate.toLocaleString()+"<br/>");//根据本地时间格式转化为字符串
//还有其他转化字符串的形式方法,文末会给出参考链接
//Math对象
document.write(Math.PI+"<br/>");//返回π
document.write(Math.E+"<br/>");//返回e
document.write(Math.LN2+"<br/>");//返回2的自然对数
document.write(Math.LN10+"<br/>");//返回10的自然对数
document.write(Math.LOG2E+"<br/>");//返回以e为底的对数
document.write(Math.LOG10E+"<br/>");//返回以e为底的对数
document.write(Math.SQRT1_2+"<br/>");//返回根号二的倒数
document.write(Math.SQRT2+"<br/>");//返回根号二
var number = 10;
document.write(Math.abs(number)+"<br/>");//返回绝对值
document.write(Math.acos(number-9)+"<br/>");//返回反余弦值
document.write(Math.sin(number)+"<br/>");//返回正弦值
document.write(Math.sqrt(number)+"<br/>");//返回平方值
document.write(Math.exp(number)+"<br/>");//返回e的指数
document.write(Math.log(number)+"<br/>");//返回自然对数
var a = 3;
var b = 6;
document.write(Math.max(a,b)+"<br/>");//返回最大值
document.write(Math.pow(a,b)+"<br/>");//返回a的b次幂
document.write(Math.random(10)+"<br/>");//返回随机数
//其余Math方法会在文末链接给出
//Number对象
document.write(Number.MAX_VALUE+"<br/>");//可表示的最大值
document.write(Number.MIN_VALUE+"<br/>");//可表示的最小值
document.write(Number.NaN+"<br/>");//表示非数字值
document.write(Number.NEGATIVE_INFINITY+"<br/>");//表示负无穷大
document.write(Number.POSITIVE_INFINITY+"<br/>");//表示正无穷大
var a = new Number(1234.567);
document.write(a.toString()+"<br/>");//转化为字符串
document.write(a.toLocaleString()+"<br/>");//转化为本地字符串
document.write(a.toFixed(2)+"<br/>");//转化为小数点后指定位数的字符串
document.write(a.toExponential()+"<br/>");//转化为指数计数法
document.write(a.toPrecision(4)+"<br/>");//转化为指定长度
//String对象
var str = "abcdef";
document.write(str.big()+"<br/>");//大字体显示
document.write(str.blink()+"<br/>");//闪烁显示
document.write(str.bold()+"<br/>");//粗体显示
document.write(str.fixed()+"<br/>");//打字机文体显示
document.write(str.fontcolor("#f00000")+"<br/>");//指定颜色显示
document.write(str.italics()+"<br/>");//斜体显示
document.write(str.link("https://www.baidu.com")+"<br/>");//链接
document.write(str.small()+"<br/>");//小字体显示
document.write(str.sup()+"<br/>");//上标显示
document.write(str.strike()+"<br/>");//删除线显示
document.write(str.charAt(2)+"<br/>");//返回指定字符
document.write(str.charCodeAt(2)+"<br/>");//返回指定字符编码
document.write(str.split('c')+"<br/>");//以指定字符分割
document.write(str.toUpperCase()+"<br/>");//以大写返回
document.write(str.match('c')+"<br/>");//返回正则匹配
document.write(str.replace('c','C')+"<br/>");//替换正则匹配
document.write(str.search('C')+"<br/>");//判断是否匹配成功
JavaScript参考手册链接:JavaScript参考手册
这其中有不合适或者不正确的地方欢迎指正,我的QQ号码:2867221444(乔金明),谢谢,也可以相互交流下,备注信息随意,只要能看得出是开发者或者学习者即可。