JavaScript基础（第一部分）_javascript 购买数量或竞拍价格-CSDN博客

本文链接：https://blog.csdn.net/Ceciliaaaa/article/details/52333513

一、

js只需要有浏览器就行

js是弱类型，java是强类型

两种方式

第一种（嵌入）

<title>无标题文档</title>

指定类型
<script type="text/javascript">

定义函数函数名
function sayHello(){

对话框文本内容
alert ("Hello ");
}
</script>
</head>

在body里面使用onload方法调用函数名

第二种（单独写一个js文件）

第一步：创建一个js文件

// JavaScript Document
//定义函数
fuction hell(){
alter("hello");
}

第二种在html文件中使用js资源，在调用函数名

<title>无标题文档</title>

使用js文件
<script type="text/javascript" src="outer.js">
</script>
</head>
调用函数名
<body οnlοad="hello();">

二、3种数据类型

（1）简单数据类型：数值型字符型布尔型

数值类型：以不带引号的数字形式出现在JavaScript程序中，进行各种数学运算

字符类型：以单引号或双引号形式出现在JavaScript的程序中，主要用于进行各种字符穿处理。转义字符：由反斜线“\”开始的特殊字符

布尔类型：只有两个值：true和false，主要用于进行数据的真假，开关逻辑运算，不能用1和0。

（2）复合数据类型：对象数组函数

（3）特殊数据类型：null undefined

null：有变量没有值，没有值但是定义了变量

undefined（未定义）：变量创建后未赋值，没有定义，

三、转义字符

\b退格符

\f换页符

\n换行符

\r回车符

四、变量和常量

常量：不能改变的数据例 1、2、

变量：在计算机内存中暂时保存的数据的地方例 vari; i=10; var count =10; var i.j;

变量可以不声明就可以直接使用k =100；

五、+号的用法

————————————————————————————————————

var x=100;数值类型

var y;字符串类型

var z;字符串类型

document指的是整个文档

document.write（"<h2>竞拍数码相机"+x+"$起价</h2>"）；

prompt：文本输入框默认值，字符串类型

y=prompt（"加多少银子","1"）；

将字符串y转换成数值类型与x相加得到z

z=x+parseFloat（y）；

文本框跳出最终出价

alter（"您最终的出价\n"+z+"$"）;

————————————————————————————————————————————————————————————————

字符串转换成数值类型的两种

parseFloat（）函数将字符串转换为folat数据

parseInt（）函数将字符串转换为int数据

如果转换失败，返回NaN值（not a number）

六、运算符和表达式

（1）算术运算符

（2）比较运算符（判断总价，加if语句）

（3）逻辑运算符

（4）嵌套

（5）switch语句

例：

定义函数函数名字
function calcu(){

取出num1和num2的值

获取表单中输入的数据

用 document.表单名.表单元素名.value

整个文档 form表单名输入框num1 用value属性获取输入框的值（取出来的是字符串）
var n1= document . f1 . num1 . value;
var n2= document.f1.num2.value;

if((n1!="")&&(n2!="")){

定义变量n1，n2（将之前的拆分开）

var price = parseFloat(n1);
var number = parseFloat(n2);

if嵌套判断是不是数字
if(isNaN(price)){
alert("竞拍价格必须是数值\n请重新输入");
return ;函数返回，不在执行后面的代码
}else{

  如果n1小于0
if(price<0){
alert("竞拍价格不能小于0\n请重新输入");
  return ;
}
   }

if(isNaN(number)){
alert("竞拍数量必须是数值\n请重新输入");
return;
}else{

  如果n2小于0
   if(number<0){
  alter("竞拍数量不能小于0\n请重新输入");
  return;
}
}

（在显示总价之前写switch）

var total = price*number; （n1*n2）

var grade=0;（折扣）

var zhifu=document.f1.pay.value;（支付方式）

switch(zhifu){

case'银行支付':

grade=0.6;

break;

case'支付宝支付':

grade=0.7;

break;

case '电话转账':

grade=0.8;

break;

case 'Q币支付':

grade=0.9;

break;

default：

alert("请选择支付方式");

return；

}

total=total*grade；（给后total重新赋值=之前的total*折扣）

由于n1,n2是从输入框获取过来的，所以都是字符串，所以要转换成数值类型才可以计算

var total =parseFloat（n1）*parseFloat（n2）；

用document（表单名、 result输入框的名字、value属性）为输入框的属性赋值
document.f1.result.value=total*grade;优惠的级别

如果total总价大于500 或者小于1000
if((total>500)&&(total<=1000)){

跳出提示框
alert("送你20Q币");
}
if((total>1000)&&(total<=2000)){
alert("送你100Q币");
}
if((total>2000)){
alert("送你无限Q币");
}

和判断是否为空时一起的

}else{
alert("购买数量或竞拍价格没有输入\n请重新输入");
}
}
</script>
</head>

<body>
<form name = "f1">
竞拍价格:<input name = "num1" type="text" value="120" />
<br/>
购买数量:<input type="text" name="num2" />
<br/>

下拉列表
支付方式：<select name="pay">

<option value="">请选择支付方式</option>
<option value="银行支付">中国银行</option>
<option value="支付宝转账">支付宝转账</option>
<option value="电话转账">电话转账</option>
<option value="Q币支付">Q币支付</option>
</select>
<br/>
预计总价:<input type="text" name="result" />
<br/> 单击属性（触发事件）
<input type="button" οnclick="calcu()" value="计算结果" />
</form>
</body>