您的位置：首页 > Web前端 > JavaScript

Android程序员学WEB前端(10)-JavaScript(1)-基础-Sublime

2017-09-05 17:08 921 查看

转载请注明出处：http://blog.csdn.net/iwanghang
觉得博文有用，请点赞，请评论，请关注，谢谢！~

index1.html-初体验：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>index1-初体验</title>
<style type="text/css">
#div1{width: 200px;height: 100px;border: 1px soild #ccc;background: yellow;display: none;}
</style>
</head>
<body>
<input type="checkbox" onmouseover="div1.style.display='block'" onmouseout="div1.style.display='none'">10天内免登陆
<div id="div1">
为了您的信息安全，请保护好您的......
</div>
</body>
</html>

index2-变量：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>index2-变量</title>
</head>
<script type="text/javascript">
var m = prompt("输入第一个数");
var n = prompt("输入第二个数");

alert(parseInt(m)+parseInt(n));

m = 66;

alert(m);
</script>
<body>

</body>
</html>

index3-数据类型：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>index3-数据类型</title>
</head>
<script type="text/javascript">
//34+5.6 // number
//"老王" "男" "Android" // string
//true,false // boolean

var a = 56;
alert(a + " 的数据类型是 ：" + typeof a); // 打印结果：56 的数据类型是 ：number

var b = "老王";
alert(b + " 的数据类型是 ：" + typeof b); // 打印结果：老王 的数据类型是 ：string

var c = true;
alert(c + " 的数据类型是 ：" + typeof c); // 打印结果：true 的数据类型是 ：boolean

var d;
alert(d + " 的数据类型是 ：" + typeof d); // 打印结果：undefined 的数据类型是 ：undefined
</script>
<body>

</body>
</html>

index4-连接符号和转义字符：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>index4-连接符号和转义字符</title>
</head>
<script type="text/javascript">
// 连接符 +
var a = 56;
var b = "老王";
var c = true;

alert(a + b + c); // 打印结果：56老王true
alert(a + a + b); // 打印结果：112老王
alert(b + a + a); // 打印结果：老王5656

// 转义字符
alert("老王说：\"你好！\""); // 打印结果：老王说："你好！"
alert("老王说：\n\"你好！\""); // 打印结果：（\n 换行效果）

</script>
<body>

</body>
</html>

index5-运算符：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>index5-运算符</title>
</head>
<script type="text/javascript">
// 取余
alert(10%4); // 打印结果：2
// ++
var i = 3;
i++;
alert("i = " + i); // 打印结果：i = 4

var m = 3,n;
n = m++;
alert("m = " + m + " , n = " + n); // 打印结果：m = 4 , n = 3

// 我个人觉得下面这些，没啥用。。。因为很容易搞错，所以项目中也会避免这样使用，既然是避免使用的东西，那么学习的价值也很小

var m1= 3,n1;
n1 = ++m1;
alert("m1 = " + m1 + " , n1 = " + n1); // 打印结果：m1 = 4 , n1 = 4

var x = 4, y = 5;
var z = x++ + y++;
alert("x = " + x + " , y = " + y + " , z = " + z); // 打印结果：x = 5 , y = 6 , z = 9

var a = 3;
var b = a++ + ++a + a++;
alert("a = " + a + " , b = " + b); // 打印结果：a = 6 , b = 13

</script>
<body>

</body>
</html>

index6-赋值运算符：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>index6-赋值运算符</title>
</head>
<script type="text/javascript">
var a = 33;
a += 5; // a = a + 5
a *= 3; // a = a * 3

var b;
alert(b=66); // 打印结果：66
alert(b); // 打印结果：66
alert(b*2); // 打印结果：132
</script>
<body>

</body>
</html>

index7-关系运算符：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>index7-关系运算符</title>
</head>
<script type="text/javascript">
var a = 33;
a += 5; // a = a + 5
a *= 3; // a = a * 3

var b;
alert(b=66); // 打印结果：66
alert(b); // 打印结果：66
alert(b*2); // 打印结果：132
</script>
<body>

</body>
</html>

index8-条件运算符：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>index8-条件运算符</title>
</head>
<script type="text/javascript">
// 条件运算符：表达式?值1:值2
var num1 = 88;
// 1.判断奇数、偶数
// alert(num1%2==0?"偶数":"奇数");
var result = num1%2==0?"偶数":"奇数";
alert(result);
// 2.判断正数、负数、零
var result1 = num1>0?"正数":(num1<0?"负数":"零");
alert(result1);
</script>
<body>

</body>
</html>

转载请注明出处：http://blog.csdn.net/iwanghang

欢迎移动开发爱好者交流
沈阳或周边城市公司有意开发Android，请与我联系
联系方式

微信：iwanghang
QQ：413711276
邮箱：iwanghang@qq.com

觉得博文有用，请点赞，请评论，请关注，谢谢！~

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： WEB HTML JavaScript

相关文章推荐

新的分享

章节导航