一、一起了解html语言的魅力
HTML5的出现,为互联网革命带来了前所未有的机遇,同时也彻底改变了我们的生活和工作方式。它是新一代的超文本标记语言,具备更加智能、灵活、功能强大和可扩展的特性。比如,它支持各种媒体类型,包括音频、视频、图像等,还能支持更加丰富全面的Web应用程序。因此,HTML5在互联网领域的发展方向和应用前景非常广阔,是未来互联网应用技术的重要方向之一。
随着移动设备的普及和互联网技术的升级,HTML5已经成为了目前最受欢迎和应用最广泛的技术之一。它可以为各种应用场景提供完美的解决方案,比如响应式网页设计、云计算、社交网络、游戏开发、移动应用程序等。而且,HTML5技术还在不断地发展和创新中,各种新的功能、特性和应用场景也在不断涌现,为互联网带来了更多的可能性和潜力。
然而,HTML5技术的发展和应用也需要付出一定的代价。一方面,HTML5标准比较复杂,需要开发者掌握更多的技术和知识,才能够灵活应用,另一方面,由于各种不同的浏览器和设备厂商对HTML5的支持和实现不同,会带来一定的兼容性问题,需要开发者在应用中做好兼容性处理。
总的来说,HTML5是一种充满活力和创新的技术,为互联网应用和用户提供了更加丰富、便捷、高效的体验。未来,随着技术的不断进步和应用场景的不断拓展,HTML5技术将会变得越来越重要和广泛,它将会带领我们走向更加美好的数字世界。
二.HTML语言主体
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title
</head>
<body>
账号:<input type="text" id="zh" οnblur="a1()"><span id="s1"> *账号长度在5- 12</span><p>
密码:<input type="text" id="mm" οnblur="a2()"><span id="s2"> *密码长度在6- 18</span><p>
再次密码:<input type="text" id="mm2" οnblur="a3()"><span id="s3"> *两次密 码 不一致</span><p>
手机号码:<input type="text" id="tel" οnblur="a4()"><span id="s4"> *手机号码 错 误</span><p>
邮箱地址:<input type="text" id="eml" οnblur="a5()"><span id="s5"> *邮箱格式 错误</span><p>
<input type="button" value="登录首页" οnclick="abc()">
</body>
</html>
二、css样式代码
<style>
span{ display: none;
font-size:6px;
color: red; }
</style>
三、javascript代码
<script>
function a1(){
//失去焦点 onblur
var zh=document.getElementById("zh").value;
var s1=document.getElementById("s1");
if(zh.length<5||zh.length>12){
s1.style.display="inline-block";
}else{
s1.style.display="none";
}
}
function a2(){
//失去焦点 onblur
var mm=document.getElementById("mm").value;
var s1=document.getElementById("s2");
if(mm.length<6||mm.length>18){
s1.style.display="inline-block";
}else{
s1.style.display="none";
}
}
function a3(){
//失去焦点 onblur
var mm=document.getElementById("mm").value;
var mm2=document.getElementById("mm2").value;
var s1=document.getElementById("s3");
if(mm2!=mm){
s1.style.display="inline-block";
}else{
s1.style.display="none";
}
}
function a4(){
//失去焦点 onblur
var tel=document.getElementById("tel").value;
var s1=document.getElementById("s4");
if(tel.length!=11 ||tel.substring(0,1)!=1){
s1.style.display="inline-block";
}else{
s1.style.display="none";
}
}
function a5(){
//失去焦点 onblur
var eml=document.getElementById("eml").value;
var s1=document.getElementById("s5");
if(eml.indexOf("@")==-1 ||eml.indexOf("@")>eml.indexOf(".")){
s1.style.display="inline-block";
}else{
s1.style.display="none";
}
}
</script>