html、js效果图及源代码

1、改变鼠标的形状
源代码:

<html>
<head>
<title>改变鼠标的形状title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
head>
<body>
<a href="#" style="cursor:url(note.ico);">将鼠标移动到我上,鼠标指针将变形a>
body>
html>

2、使用删除线样式标注商品特价


<html>
<head>
<title>使用删除线样式标注商品特价title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
head>
<body>
<img src="bike.jpg" width="200" height="165"><br> 
  
<span style="text-decoration:line-through">原价:796(元)span>
<br> 
<span>现价:399(元)span>
body>
html>

效果图:html、js效果图及源代码_第1张图片

3、从身份证号码中获取出生日期

  <title>从身份证号码中获取出生日期title>
    <script language="javascript">
    function checkRealName(){
        var str=form1.realName.value;           //获取输入的真实姓名
        if(str==""){        //当真实姓名为空时
            alert("请输入真实姓名!");form1.realName.focus();return;
        }else{              //当真实姓名不为空时
/*验证是否为汉字*/         var objExp=/[\u4E00-\u9FA5]{2,}/;   //创建RegExp对象

            if(objExp.test(str)==true){     //判断是否匹配
                alert("您输入的真实姓名正确!");
            }else{
                alert("您输入的真实姓名不正确!");
            }
        }
    }
    script>
  head>

  <body>
  <center>
  <form name="form1" method="post" action="">
  请输入真实姓名:<input name="realName" type="text" id="realName">
  <input name="Button" type="button" onClick="checkRealName()" value="检测">
  form> 
  center>  

同理,验证;

/*验证email*/
var str=email;
var expression = /\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*/;
var objExp = new RegExp(expression);
if(objExp.test(str) == true){
return true ;
}else
return false;


/*验证电话号码*/
var str=tel;
var expression=/(\d{3}-?\d{8}|(\d{4}-)(\d{7})/;
var objExp = new RegExp(expression);
if(objExp.test(str) == true){
return true ;
}else
return false;


/*验证是否是汉字*/
var str=name;
var expression = /[\u4E00-\u9FA5/;
var objExp = new RegExp(expression);
if(objExp.test(str) == true){
return true ;
}else
return false;


/*验证身份证号码*/
var str=NO;
var expression = /\d{17}[\d|X]|\d{15}/;
var objExp = new RegExp(expression);
if(objExp.test(str) == true){
return true ;
}else
return false;


/*验证网址是否合法*/
var str=url;
var expression = /http(s)?:\/\/([\w-]+\.)+[\w-]+(/[\w- ./?%&=]*)?/;
var objExp = new RegExp(expression);
if(objExp.test(str) == true){
return true ;
}else
return false;


/*限制字符串长度str为指定字符串,digit为指定最大长度*/
function checkstr(str,digit)
{
var n=0;
for(int i=0;ivar leg=str.charCodeAt(i);
if(leg>255)
{
n+=2;
}else
n+=1;
}
if(n>digit)
{
return true;
}else
return false;
}

4、实时显示系统时间

<html>
  <head>
    <title>实时显示系统时间title>
    <script language="javascript">
    function realSysTime(clock){
        var now=new Date();         //创建Date对象
        var year=now.getFullYear(); //获取年份
        var month=now.getMonth();   //获取月份
        var date=now.getDate();     //获取日期
        var day=now.getDay();       //获取星期
        var hour=now.getHours();    //获取小时
        var minu=now.getMinutes();  //获取分钟
        var sec=now.getSeconds();   //获取秒钟
        month=month+1;//在js中的月份是从0开始的
        var arr_week=new Array("星期日","星期一","星期二","星期三","星期四","星期五","星期六");
        var week=arr_week[day];     //获取中文的星期
        var time=year+"年"+month+"月"+date+"日 "+week+" "+hour+":"+minu+":"+sec;   //组合系统时间
        clock.innerHTML="当前时间:"+time;   //显示系统时间
    }
    window.onload=function(){
        window.setInterval("realSysTime(clock)",1000);  //实时获取并显示系统时间
    }
    script>
  head>

  <body>
    <div id="clock">div>
  body>
html>

你可能感兴趣的:(css)