关于JavaScript学习

来源：互联网发布：mac系统不见了编辑：程序博客网时间：2024/04/28 09:57

关于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>

0 0