JavaScript对HTML文件进行数据访问

要求

用JavaScript对HTML文件(见上一篇博客)进行数据访问,将获得的所有个人简历信息项的值以XML方式进行组织,并通过对话框显示出来;
(具体来说就是通过DOM来获得所有个人简历信息项的值,并显示在网页显示)

源代码

//进入页面的提示信息
alert("建议使用chrome或360浏览器打开");         
          //正则表达式校验手机号
		  function checkphone(){
        	  var phone=document.getElementById('textphone').value;
        	  var regx=/^1[3|5|7|8]{1}[0-9]{9}$/;
        	  var flag=regx.test(phone);
        	return flag;
          }
		  //正则表达式校验邮箱格式
		  function checkmail(){
			  var reg = /^[a-zA-Z0-9]+([-_.][a-zA-Z0-9]+)*@[a-zA-Z0-9]+([-_.][a-zA-Z0-9]+)*\.[a-z]{2,}$/;
              var mail=document.getElementById('textmail').value;
              var flag=reg.test(mail);
			  return flag;
		  }
		  //获取文本框中的值
         function gettext(id){
        	 return document.getElementById(id).value;
         }
		//获取下拉列表框的值
		function getselect(id)
		{
		return document.getElementById(id).value;
		}

		function check(){//将数据显示成xml格式
        	var content='<?xml version="1.0" encoding="GB2312"?>';
        	
        	//写DTD
        	content+='<!DOCTYPE resume['+'\n';;
        	content+='<!ELEMENT resume (students*)>'+'\n';
        	content+='<!ELEMENT students (name,sex,years,months,days,nation,location,politic,speciality,textphone,textmail,textaddress,hobby,background,languageskill,computerskill,award,experience,activities,selfassessment)>';
        	content+='<!ELEMENT name (#PCDATA)>'+'\n';
        	content+='<!ELEMENT sex (#PCDATA)>'+'\n';
        	content+='<!ELEMENT years (#PCDATA)>'+'\n';
        	content+='<!ELEMENT mouths (#PCDATA)>'+'\n';
        	content+='<!ELEMENT days (#PCDATA)>'+'\n';
        	content+='<!ELEMENT nation (#PCDATA)>'+'\n';
			content+='<!ELEMENT location (#PCDATA)>'+'\n';
        	content+='<!ELEMENT politic (#PCDATA)>'+'\n';
        	content+='<!ELEMENT speciality (#PCDATA)>'+'\n';
        	content+='<!ELEMENT textphone (#PCDATA)>'+'\n';
        	content+='<!ELEMENT textmail (#PCDATA)>'+'\n';
        	content+='<!ELEMENT textaddress (#PCDATA)>'+'\n';
        	content+='<!ELEMENT hobby (#PCDATA)>'+'\n';
        	content+='<!ELEMENT background (#PCDATA)>'+'\n';
        	content+='<!ELEMENT languageskill (#PCDATA)>'+'\n';
        	content+='<!ELEMENT computerskill (#PCDATA)>'+'\n';
        	content+='<!ELEMENT award (#PCDATA)>'+'\n';
			content+='<!ELEMENT experience (#PCDATA)>'+'\n';
			content+='<!ELEMENT activities (#PCDATA)>'+'\n';
			content+='<!ELEMENT selfassessment (#PCDATA)>'+'\n';
        	content+=']>'+'\n';
        	
        	//再写xml
        	content+='<resume>'+'\n';
			content+='<students>'+'\n';
        	content+='<name>'+gettext("textname")+'</name>'+'\n';
			content+='<sex>'+getselect("sex")+'</sex>'+'\n';
        	content+='<years>'+getselect('years')+'</years>'+'\n';
			content+='<months>'+getselect('months')+'</months>'+'\n';
			content+='<days>'+getselect('days')+'</days>'+'\n';
			content+='<nation>'+getselect('nation')+'</nation>'+'\n';
			content+='<location>'+gettext('location')+'</location>'+'\n';
        	content+='<politic>'+getselect('politic')+'</politic>'+'\n';
        	content+='<speciality>'+getselect('speciality')+'</speciality>'+'\n';
        	content+='<textphone>'+gettext('textphone')+'</textphone>'+'\n';
			content+='<textmail>'+gettext('textmail')+'</textmail>'+'\n';
        	content+='<textaddress >'+gettext('textaddress')+'</textaddress>'+'\n';
			content+='<hobby >'+gettext('hobby')+'</hobby>'+'\n';
        	content+='<background>'+getselect('background')+'</background>'+'\n';
			content+='<languageskill>'+gettext('languageskill')+'</languageskill>'+'\n';
			content+='<computerskill>'+gettext('computerskill')+'</computerskill>'+'\n';
			content+='<award>'+gettext('award')+'</award>'+'\n';
			content+='<experience>'+gettext('experience')+'</experience>'+'\n';
        	content+='<activities>'+gettext('activities')+'</activities>'+'\n';
			content+='<selfassessment>'+gettext('selfassessment')+'</selfassessmentt>'+'\n';
        	content+='</students>'+'\n'+'</resume>'+'\n';

			if(checkphone()&&checkmail()){
			 alert(content);
		     }
		 else{
		     if(!checkphone()){
				 alert('手机号不符合正则表达式规范');
			 }
			 if(!checkmail()){
				 alert('邮箱格式不符合正则表达式规范');
			 }
		 }   
		} 

HTML加入的代码

//位置自己定,我放在了class3块下
//添加按钮
  <input type="button" style="background-color:white;height:30px;" value="xml格式数据" onclick="check()">
  //引用js
		<script src="个人简历.js">
        </script>

效果图

主界面
在这里插入图片描述
点击xml格式数据
在这里插入图片描述

原创文章 44 获赞 47 访问量 1万+

猜你喜欢

转载自blog.csdn.net/weixin_44480968/article/details/105261382
今日推荐