版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/TopWilling/article/details/62108755
关于JavaScript学习
: JavaScript初步
对于JavaScript的学习,初步.
1.在网页上弹出alert栏
<html>
<head>
<meta charset="UTF-8">
<title></title>
<!--内部结合-->
<script>
标题
//js代码,弹出alert栏
alert("hello world..");
</script>
</head>
<body>
</body>
</html>
2.关于JavaScript函数的初步学习
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script>
//定义了一个有返回值的函数
function getsum(i,j)
{
return (i+j);
}
var sum = getsum(19,11);
//弹出一个alert栏,展示所得到的和
alert(sum);
//********************
//匿名函数的使用
//匿名函数; 通常和事件配合起来使用(jq)
var get1sum = function(i,j)
{
return (i+j);
}
var sum =get1sum(11,29);
alert("总和是:"+sum);
</script>
</head>
<body>
</body>
</html>
3.一个简单的点击事件
<html>
<head>
<meta charset="UTF-8">
<title></title>
<!--- 确定事件; 点击,获得焦点....
- 创建一个函数响应这个事件
-->
<script>
function sayHello(){
alert("hello...");
}
</script>
</head>
<body>
<!--点击事件,需要一个函数响应这个事件-->
<!--通过设置一个按钮,实现点击时对应的函数,该函数通过弹出一个alert栏来显示按钮被点击了-->
<input type="button" value="点我吧..." onclick="sayHello()"/>
</body>
</html>
4.图片的切换
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script>
var i = 1;//定义全局变量
function next()//该函数完成自加
{
i++;
if(i>=5)//不能让图片的索引超出图片的数量
{
i=1;
}
//getElementById 得到标记img的 id
var obj = document.getElementById("imgId");
obj.src = "image/"+i+".jpg";
}
function before()
{
i--;
if(i==0)
{
i=4
}
var obj = document.getElementById("imgId");
obj.src = "image/"+i+".jpg";
}
</script>
</head>
<body>
<img src="image/1.jpg" width="200px" id="imgId"/><br />
<input type="button"value="上一张" onclick="before()"/>
<input type="button"value="下一张" onclick="next()" />
</body>
</html>
5.定时和延时
<html>
<head>
<meta charset="UTF-8">
<title>
</title>
<script>
function sayHello()
{
console.log("here is the page");
}
setInterval("sayHello()",2000);//定时调用函数,(不停的调用)
setTimeout("sayHello()"2000);//延时调用函数,只调用一次~
</script>
</head>
<body>
</body>
</html>
6.判断输入栏是否为空
<!--1.给注册按钮设置一个点击事件
2.创建一个checkData()的函数响应这个事件
3.在checkData()函数体里, 得到用户名输入框对象(document.getElementById("id名")), 得到用户名的值
4.判断用户名是否为空-->
<script>
//创建一个checkData()的函数响应这个事件
function checkData() {
//得到用户名输入框对象(document.getElementById("id名"))
var inputObj = document.getElementById("usernameId");
//得到用户名的值;
var value = inputObj.value;
//判断用户名是否为空
if(value == ""){
//用户名为空
alert("用户名不能为空!");
//不能提交
return false;
}
}
</script>