Javascript基础(2)

开始更咯~~~嘻嘻。

----------------------------------------------------------------------------------

异常捕获:即当Javascript引擎执行Javascript代码时发生了错误,导致程序停止运行。异常产生并将这个错误信息生成。

try{

      错误信息处理;

}catch(err){

错误信息处理;

}

1.可以在上述过程用throw语句来自定义建立一个语句。

例:<form>

             <input type="text" id="txt'/>

            <input type="button" id="btn" value="按钮" onclick="demo()"/>

    </form>

     <script>

        function demo(){

            try{

               var e=document.getElementById("txt").value;

           if(e==""){

                       throw "输入的值为空";

                        }

             }catch(err){

                  alert(err);

             }

}

     </script>

结果:界面显示文本框,和按钮若无输入就点击按钮则弹出框提示“输入的值为空”。若输入,则无提示。

-------------------------------------------------------------------------------------------------

javascript事件:事件即可以被javascript检测到的行为。(其实我们上面的例子中已经有使用过了,就比如button中用的onclick)

1.onclick:点击事件

2.onmouseover:鼠标经过事件

3.onmouseout:鼠标移出事件

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

例(针对2.3):<div onmouseout="onOut(this)"  onmouseover="onOver(this)"></div>

                      <script>

                     function onOver(ooj){

                              ooj.innerHTML="hello";

                      }

                     function onOut(ooj){

                            ooj.innerHTNL="world";

                      }

                     </script>

执行结果:(ps:可以在用cs中s给div大小颜色等,比较好观察)在div框,鼠标移入出现hello,鼠标移出出现world.

对上述代码注意的再次解疑惑(上期的一些注意点):函数命名第二个字母大写;ooj为局部变量,当函数执行时才有内存,所以两个可以都用ooj.

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

4.onchange:文本内容改变事件

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

例(针对4):

            <form>

                   <input type="text" onchange="changeDemo(this)"/>

             </form>

              <script>

                  function changeDemo(){

                           alert("文本框中内容改变了!");

                          }

              </script>

结果:界面出现一文本框,当你输入东西时,弹出提示框“文本框中内容改变了!”。

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

5.onselect:文本框选中事件

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

例(针对5):

   <form>

            <input type="text"  onselect="changeDemo(this)"/>

   </form>

    <script>

            function changeDemo(bg){

                     bg.style.background="red";

             }

     </script>

结果:界面出现文本框,当输入东西时,在文本框中选中这些东西,文本框背景变为红色。

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

6.onfocus:光标聚集事件。(跟5的差不多,只是它的执行效果是鼠标放上后就变色什么的。)

7.onblur:移开光标事件。

8.onload:网页加载事件。

~~~~~~~~~~~~~~~~~~~~~~~~~~~

例(针对8):

<body onload="demo()">

      <script>

              function demo(){

                     alert("网页加载完毕。");

              }

        </script>

</body>

结果:当网页加载完毕,出现提示框“网页加载完毕。”

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

9.onunload:关闭网页事件。

--------------------------------------------------------------------------------------------------------

接下的我就进入了学习dom,嘻嘻,后续再更。

原文地址:https://www.cnblogs.com/yanyuanyuan/p/5711406.html