2020-09-04

最新推荐文章于 2024-09-06 23:41:09 发布

MintHelen

最新推荐文章于 2024-09-06 23:41:09 发布

阅读量111

点赞数

文章标签： html

本文链接：https://blog.csdn.net/MintHelen/article/details/108408466

版权

1.font

font color="red" face = "宋体" size = “7>我是字体标签 </font>

2.iframe

  <iframe src="dome2.html" with = "2000" height ="1000" name ="abc"></iframe>
       <br/>
        <ul>
            <li> <a href="dome3.html" target="abc">dome2</a></li>
        </ul>

在这里插入图片描述

3.函数定义

      <title>Title</title><meta charset="UTF-8">
    <script type = "text/javascript">
    function fun(){
        alert("无参函数被调用了");

    }
    function fun2(a,b){
        alert( "有参函数被调用了 a= "+a +"b="+ b  );
    }
    fun2(12,"abc");
    </script>

2. <title>Title</title><meta charset="UTF-8">
    <script type = "text/javascript">
      var fun = function(){
          alert ("无参函数");

      }
       var fun2 = function(a,b){
          alert("有参函数a = " +a+ ",b=" +b);
       }
       var fun3 = function(num1,num2){
          return num1+num2;
       }
       alert(fun3(100,200));
    </script>

4.onclick

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript">
        function onlickfun(){
            alert("静态注册");
        }

        window.onload = function(){
           var obj = document.getElementById("bt001");
           // alert(obj);
            obj.onclick = function(){
              alert("动态注册");
            }
        }
    </script>
</head>
<body>
   <button onclick="onlickfun();">按钮1</button>
   <button id = "bt001">按钮2</button>
</body>
</html>

5.onblur失去焦点事件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript">
         function onblurfun(){
             console.log("静态注册失去焦点事件");
         }

         window.onload = function(){
              var  passwordobj =document.getElementById("password");
              //alert(passwordobj);
              passwordobj.onblur = function(){
                  console.log("动态注册失去焦点");
              }
         }
    </script>
</head>
<body>
      用户名：<input type="text" onblur="onblurfun();"><br/>
      密码：<input  id = "password" type="text"><br/>
</body>
</html>

6.onchange事件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript">
   function onchangefun() {
          alert("女神已经改变了");
   }

   window.onload  = function(){
     var  passobj =  document.getElementById("001");
     passobj.onchange = function(){
         alert("男神已经改变了");
     }
   }
    </script>
</head>
<body>
     <select onchange="onchangefun();">


         <option>女神</option>
         <option>a</option>
         <option>b</option>
         <option>c</option>
     </select>
     <select id = "001">
         <option>男神</option>
         <option>a</option>
         <option>b</option>
         <option>c</option>
     </select>
</body>
</html>

7.onsubmit 表单提交事件

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script type="text/javascript">
        function onsubmitfun() {
             alert("静态注册,发现不合法");
              return false;
        }

        window.onload  = function(){
            var forobj = document.getElementById("form01")
             forobj.onsubmit = function(){
                alert("动态注册表发现不合法");
                return false;
             }
        }
    </script>
</head>
<body>
          <form action = "http://localhost:8080 " method="get" onsubmit="return  onsubmitfun()" >
               <input type = "submit" value="静态注册"/>
          </form>

          <form action = "http://localhost:8080 "  id = "form01" >
              <input type = "submit" value="动态注册"/>
          </form>
</body>
</html>

8.正则表达式

   <script type="text/javascript">

      var patt = /\w/;
      var  str = "[[[]]]";
      alert(patt.test(str));
    </script>

9.验证效果

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script type="text/javascript">
    function  onclickFun() {


        var usernameObj = document.getElementById("username");

        var usernameText = usernameObj.value;


        var patt = /^\w{5,12}$/;

        var usernameSpanObj = document.getElementById("usernameSpan")


        if (patt.test(usernameText)) {
            // alert("用户名合法");
            //usernameSpanObj.innerHTML = "用户名合法";
                usernameSpanObj.innerHTML = "<img src = \"right.png\" width=\"18\" height=\"18\">";
        } else {
            //usernameSpanObj.innerHTML = "用户名不合法";
                usernameSpanObj.innerHTML = "<img src = \"w1rong.png\" width=\"18\" height=\"18\">";
        }
     }
    </script>
</head>
<body>
       用户名：<input type = "text" id = "username" value="wzg/">
       <span id = "usernameSpan" style = "color :red;">

       </span>
       <button onclick="onclickFun()">校验</button>
</body>
</html>