地理信息科学专业毕业实习报告

M号24套卡•VHebeiIfdiversityofEngineering地理信息科学专业在外毕业实习报告（2015—2016学年第一学期）实习企业：北京拓尔思信息技术股份有限公司 班级： 地理1101 名： 学号： 指导老师： 毕业实习报告一、实习单位及岗位介绍1、公司简介北京拓尔思信息技术股份有限公司是国家规划布局内重点软件企业，公司注册资本2.05亿元，2011年6月在深圳证券交易所创业板上市，股票代码300229，公司资产超过人民币10亿元，拥有5家全资或控股子公司，并在全国设立了20多个分支机构。拓尔思是中国领先的大数据技术和服务提供商，在信息检索、大数据管理和挖掘等方面具有国内外领先的自主核心技术和尖端产品；在内容管理、知识管理、互联网舆情分析等领域具有先进成熟的软件产品线；在新一代电子政务、信息安全、新媒体、智慧城市、企业互联网创新、金融电信等垂直行业具有独特价值的解决方案。公司产品和服务已被国内外4000多家机构用户广泛使用。。拓尔思始终以企业、客户、员工共赢为核心价值观，秉承以人为本的经营理念，奉行客户至上的原则，汇聚了一批具有强烈进取心和创新精神以及高度责任感的专业团队。多年来，公司始终保持良好的发展势态，并和国内外知名厂商建立了战略合作关系，在云计算、大数据和移动互联网的发展浪潮中，公司致力于大数据技术和服务的持续创新，为用户提供自主可控、以数据驱动和云服务为特征的新一代信息技术服务，并通过多种形式的慈善和公益活动履行一个负责任企业公民的承诺。2、人才职业素质要求有比较扎实的计算机专业基础知识，有至少一门计算机语言基础，对数据结构等有深刻理解。具备良好的自学和创造能力，热爱编程技术研究和新技术的探索；工作踏实、细致、有耐心，具备良好的职业道德和工作态度；具备团队合作开发及沟通能力。3、实习岗位情况实习生要求有一定的编程能力，本人在这批实习生中水平处于中上水平。二、实习内容及过程1、工作岗位Web前端开发实习生2、学习阶段TRSWCM的学习TRSWCM的简介

TRS内容协作平台（TRSWebContentManagement,简称：TRSWCM）涵盖网站建立、内容服务、内容传递等内容价值链的各个方面，将结构化和非结构化信息提供给所有用户。是一套完全基于Java和浏览器技术的网络内容管理软件。TRSWCM的功能。（1）实现外部门户网站静态页面的发布，即网站静态页面的生成工具；（2）通过可视化的采集界面方便的编辑所需要发布的网站信息；（3）引用了频道（即栏目）的概念，将网站信息分类归属于某个频道，实现信息分类汇总；通过站点来管理相应的频道；（4）通过模板的制作可以实现页面的定制。TRSWCM的发布原理TRSWCM的发布原理是利用关系数据库（MicrosoftSQLServer、Oracle、DB2等）作为后台支持数据库，可以按照用户的要求设置栏目和显示风格（通过模板文件），最终自动从数据库中抽取内容生成网页（HTML文件），从而完成网站的设计工作和发布工作。WCM糜务罂WebServer北京拓尔思信息技术部氏公司vww.trs.coniL.cn网站的最终用户网站管理、维护人员通过捌览器访回WCM糜务罂WebServer北京拓尔思信息技术部氏公司vww.trs.coniL.cn网站的最终用户网站管理、维护人员通过捌览器访回WCM系统，进行系统和数据的管理数据库服务器，比如Oracle.用于存储网站数据*WCM系统能时其中的数据进行管理和发布*TRSWCM运行环境的要求（1）硬件配置要求CPU:主频不低于3.0GHz；内存：不低于1G；硬盘：不低于10G；（2）操作系统要求Windows2000/2003/2008server；Linx（内核版本不低于2.4x）；SunSolaris8或以上版本IBMAIX5.1或以上版本；（3）客户端浏览器IE6.0以上（4）JAVA运行环境SunJDK1.4.2以上（5）应用服务器要求ApacheTomcat5.0及以上；IBMWebsphere及6.0以上；BEAWeblogic8.1及以上；【注意】安装介质中自带jdk和tomcat。（6）数据库服务器MSSQLServer2000sp3及以上；Oracle9i及以上DB2V9.0及以上WCMV6.5安装安装WCM之前，必须保证后台数据库服务器已经安装完毕并正常启动运行中。以下安装步骤均以windows操作系统、MSSqlserver2000数据库、采用介质自带的jdk和tomcat为例。（1）双击安装介质，选择使用语言（2）接受，点击下一步。T口广本隹可口内说惧步不运其也.家性和密市.圈子直第目蜡白的非强亘叩茸国等可双•仁而同斑J苒产二：凡T口广本隹可口内说惧步不运其也.家性和密市.圈子直第目蜡白的非强亘叩茸国等可双•仁而同斑J苒产二：凡方枳:回他介日许可啮碳川，曳胡城舞自产变£麻通口更围除车娣尸时百出黑争（以下司璇中说3是怒号T喀会可之循有关I/轮件产盼点建皿.伸田产吊怛蒲玮甘利勒怦.程美E嵋阚抖及付闰跳孔武书子文梏,傀一皂管射、学制或谓他方揖使月本找泮产品，印加.不华同定技及本蝌期*¥的雪:鼬曲配的束.如果包不同毒芈电四项中的会歌，E阻凄交独或视本班件产丛，芹眦耳亲力康茶.C*人轶竞畤阿曲地翦乾⑥『1B11**V-，**"-.,0"HL*11■1L.，——■=11■LFBI11E1■"■■ ,"一••一⑥徐入榜市午可怪仅枭发tnMMI■■■■■■■■MUHII'-IIUllUIHIIUIIfl.llEjTr现洎©一岁（N口晌©口晌©取洎心 上一步的I下一步®(5)产品注册登陆公司网址http：///others/buy/productreg/在线提交相关信息。获取序列号后，打开注册文件：.\TRS\TRSWCM5.2\Tomcat\webapps\wcm\WEB-INF\classes\license\LICENSE.trswcm,更新覆盖文件中的内容。重新启动wcm应用服务即可。【注意】建议备份序列号，若不更换网卡的情况下，重新安装亚加，序列号不发生变化。(6)系统配置文件与关系型数据库连接配置文件：\TRS\TRSWCMV6\Tomcat\webapps\wcm\WEBTNF\classes\trsconfig\domainconnectionURL="jdbc:jtds:sqlserver://:1433/TRSWCMV6"connectionUser="sa"connectionPassword="Encryptedc2E.”【注意】密码为加密，可直接修改密码后保存，系统执行后可自动加密。应用服务器端口配置文件：\TRS\WCM\TRSWCMV65\Tomcat\conf\server.xml配置tomcat访问端口<ConnectorclassName="org.apache.coyote.tomcat4.CoyoteConnector"port=8080minProcessors=5maxProcessors=75enableLookups="true"redirectPort="8443"acceptCount="100"debug="0"connectionTimeout="20000"useURIValidationHack="false"disableUploadTimeout="true"/>配置TRSWCM的虚拟目录<Contextpath="/pub"docBase="D:\TRS\WCMData\pub"/>WCM日志配置文件\TRS\TRSWCMV65\Tomcat\webapps\wcm\WEB-INF\classes\perties配置输出日志路径10g4j.appender.A2.File=D:/TRS/TRSWCMV6/wcmlogs/TRSWCMLog.txt强烈建议使用绝对路径（6）系统启动与登录启动、停止服务器端tomcat启动：执行 开始 程序 TRS TRSWCMV6 TRSWCMV6Sartup停止：执行 开始 程序 TRS TRSWCMV6 TRSWCMV6Shutdown客户端登陆访问WCM，IE下输入地址：http://（wcm系统安装的ip地址）：（应用服务器的网络端口）/wcm用户/密码：admin/trsadmin（初始密码，登录后可修改）WCM功能使用介绍旬祖站点包连4目yw栏目切）包j姓模相tg拮榔第模桢F期货模板3并使用育栏目上网站域据炭而（1）如何使用WCM系统创建一个网站（文字库）方法一:口哙底JH群孰口哙底JH群孰立旭£由方法二:m|]4下一步方法二:m|]4下一步新建/影改站点档的自动发布定时时间一峋定I取巧।(2)网站数据采编发文档：系统所管理的最基本的数据单元，一篇文档对应于网站上的一篇文

章；文档管理涉及到的相关操作有：文档采集：采集的4种类型文档文档编辑、修改文档预览文档转发：一篇文档同时显示在多个栏目文档删除文档审核（可选）：可根据业务流程自动改变文档的状态发布文档：将改篇文章发布到网站上新建文档■方法一 •方法二-氏文宇厩K三.塔训潘米■玷占2用片新展.④-氏文宇厩K三.塔训潘米■玷占2用片新展.④5kAM司I&新图中心ER＞都喀2^1达十胜自栏目右,，力财独寻/＞体前各科的GrElE瑞占国内用■&t«t由聿里道I■:?.法君鹏点匚口•.m&创I试站戊.J；EW1作移动这个色自触目放丸回收站懂靛梓目电信发布这个栏目慎浅布此后H的,同nar晓颜道⑼1揉IF芷窥虫1协柞眼要©韩建站点思索J—富导入 F自白导用 卜莫档 1=河E交宇庄1峰设这个栏目授扳殍2-,酷训通1enJ移动这个栏目忙尾亍后将栏目放入回收站聒点幻左0g技览这个栏目甘迪内容词«Mt短布这个崖目里目幻提s£,■!?.我对t北栏目的击页栏盹总lij£=导出这个争目工便漳司方捶愎豆子栏目ffifra克室於新国T在目亡吏琳我方这子产自常锚反布整个栏目j1ali物蚯腱爸雷旦根壶盘士x新建文档方法三:栏目文若像作任务方法三:栏目文若像作任务日-页面下切换到“文档”按钮;-页面下切换到“文档”按钮;-由上方“创建一篇新文档”创建一篇新文档从外部导入文裆移动所有文档到复制所有文裆到ZJ（3）TRS置标说明：TRS_DOCUMENTS：循环内容的显示置标。主要用于概览信息的显示；主要的参数：ID（频道名称）、NUM（显示内容条数）等；TRS_RECORD:记录置标。在一个TRS_DOCUMENTS里面有多个循环内容时，可通过此置标来控制不同的显示风格；用在TRS_DOCUMENTS置标对儿中间；TRS_DOCUMENT:引用某个具体的数据库字段的内容的作用；用在TRS_DOCUMENTS和TRS_RECORD置标对儿中间；主要参数：ID（数据库字段名称）TRS_TEMPLATE:用来实现模板的嵌套；显示“国内新闻”频道最新10条标题<trs_documentsid="国内新闻"num=“10”><trs_documentfield=“doctitle”>标题</trs_document></trs_documents>显示“图片新闻”频道最新5张图片附件<trs_documentsid="图片新闻”num=“5”><trs_appendixmode=“pic” extra=“…”autolink=“true”>图片附件</trs_appendix></trs_documents>显示“新闻”频道下所有一级子频道的频道名称<trs_channelsid=“新闻”><trs_channelfield=“chnldesc”>子频道名称</trs_channel></trs_channels>显示相关新闻，即与当前新闻相关联的其他新闻标题列表<trs_relnewsmode=“all”num=“10”><trs_documentfield=“doctitle”></trs_document></trs_relnews>当前位置：<trs_curpage...></trs_curpage>（4）典型应用实例首页滚动新闻图片<scriptlanguage='JavaScript'〉varimgUrl=newArray（）；varimgLink=newArray（）；varimgTz=newArray()；varadNum=0；varkk=1；varfilepath_liucp=""；<TRS_DOCUMENTSNUM="5"ID="图片新闻"》filepath_liucp=′<TRS_recpath></trs_recpath>';filepath_liucp=filepath_liucp.substring(0,filepath_liucp.lastIndexOf("/")+1);imgUrl[kk]=filepath_liucp+'<TRS_APPENDIXINDEX="0"MODE="PIC"FIELD="APPFILE"></TRS_APPENDIX>';imgLink[kk]='<trs_recpath></trs_recpath>';imgTz[kk]='<ahref="<TRS_recpath></trs_recpath>"target="_blank"><fontcolor=#CC0000><TRS_DOCUMENTAUTOLINK="false"FIELD="doctitle"NUM="42"></TRS_DOCUMENT></font></a>';kk++;</TRS_DOCUMENTS>kk—;varimgPre=newArray();varj=0;for(i=1;i<=5;i++){if((imgUrl[i]!="")&&(imgLink[i]!="")){j++;}else{break;}}functionplayTran(){if(document.all)imgInit.filters.revealTrans.play();}varkey=0;functionnextAd(){if(adNum<j)adNum++;elseadNum=1;if(key==0){key=1；}elseif(document.all){imgInit.filters.revealTrans.Transition=6；/*transition : 可选项。整数值(Integer)。设置或检索转换所使用的方式。0 : 矩形收缩转换。: 矩形扩张转换。: 圆形收缩转换。: 圆形扩张转换。: 向上擦除。: 向下擦除。: 向右擦除。: 向左擦除。: 纵向百叶窗转换。: 横向百叶窗转换。: 国际象棋棋盘横向转换。: 国际象棋棋盘纵向转换。: 随机杂点干扰转换。: 左右关门效果转换。: 左右开门效果转换。: 上下关门效果转换。: 上下开门效果转换。: 从右上角到左下角的锯齿边覆盖效果转换。: 从右下角到左上角的锯齿边覆盖效果转换。: 从左上角到右下角的锯齿边覆盖效果转换。: 从左下角到右上角的锯齿边覆盖效果转换。: 随机横线条转换。: 随机竖线条转换。: 随机使用上面可能的值转换。*/imgInit.filters.revealTrans.apply();playTran();}document.images.imgInit.src=imgUrl[adNum];document.getElementById('tpxw').innerHTML='<ahref="’+imgLink[adNum]+'"target="_blank">'+imgTz[adNum]+'</a>';theTimer=setTimeout("nextAd()",6000);//转换间隔时间)functiongoUrl(){jumpUrl=imgLink[adNum];jumpTarget='_blank’;if(jumpUrl!=''){if(jumpTarget!='')window.open(jumpUrl,jumpTarget);elselocation.href=jumpUrl;

))</script><trclass="14txt22"><tdbgcolor="#F0F0E8"><ahref="javascript:goUrl()"><imgstyle='FILTER:revealTrans(duration=2,transition=1)’src='javascript:nextAd()'border='0'width='243'height='168'class='img01'name='imgInit'></a></td></tr><tr><tdclass="14txt22"><center><fontcolor="#CC0000"><spanid='tpxw'>标题</span></font></center></td></tr></table>概览页面分页跳转<SCRIPTLANGUAGE="JavaScript">//createPageHTML(${PAGE_COUNT},${PAGE_INDEX},"${PAGE_NAME}"${PAGE_EXT}");varcurrentPage=${PAGE_INDEX};//所在页从0开始//varheadPage="${PAGE_NAME}"+"."+"${PAGE_EXT}";//首页//vartailPage="${PAGE_NAME}_"+(count1)+".${PAGE_EXT}"//尾页varprevPage=current1//上一页varnextPage=currentPage+1//下一页varcountPage=${PAGE_COUNT}//共多少页document.write("共"+countPage+"页 ； ；")；//设置上一页代码if(countPage>1&¤tPage!=0&¤tPage!=1)document.write("<ahref=\"${PAGE_NAME}.${PAGE_EXT}\">首页</a> <ahref=\"${PAGE_NAME}"+"_"+prevPage+"."+"${PAGE_EXT}\">上一页</a> ");elseif(countPage>1&¤tPage!=0&¤tPage==1)document.write("<ahref=\"${PAGE_NAME}.${PAGE_EXT}\">首页</a> <ahref=\"${PAGE_NAME}.${PAGE_EXT}\">上一页</a> ");elsedocument.write("首页 上一页 ");//循环varnum=5;for(vari=0+(currentPageT-(currentPageT)%num);i<二(num+(currentPageT-(currentPageT)%num))&&(i<countPage);i++){if(currentPage==i)document.write((i+1)+" ");elseif(i==0){document.write("<ahref=\"${PAGE_NAME}.${PAGE_EXT}\">"+1+"</a> ");}elsedocument.write("<ahref=\"${PAGE_NAME}"+"_"+i+"."+"${PAGE_EXT}\">"+(i+1)+"</a> ");}//设置下一页代码if(countPage>1&¤tPage!=(count1))document.write("<ahref=\"${PAGE_NAME}"+"_"+nextPage+"."+"${PAGE_EXT}\">下一页</a> <ahref=\"${PAGE_NAME}_"+(count1)+".${PAGE_EXT}\">尾页</a> ");elsedocument.write("下一页 尾页 ；")；//跳转页面document.write("<fontclass='9ptb'>转到第〈inputtype='text'id='num'value="+(currentPage+1)+"style='width：30px'>页"+" ；<inputtype='submit'value='提交'onClick=javacript：toPage()></font>")；functiontoPage(){var_num=document.getElementById("num").value；varstr="${PAGE_NAME}"+"_"+(_num-1)+"."+"${PAGE_EXT}"；varurl=location.href.substring(0,location.href.lastIndex0f("/")+1)；if(_num<=1||_num==null)location.href=url+"${PAGE_NAME}"+"."+"${PAGE_EXT}"；elseif(_num>countPage)alert("本频道最多"+countPage+"页")；elselocation.href=url+str；}</SCRIPT>【注意】：概览分页脚本代码必须结合documents置标中的pagesize分页参数。(4)用户和权限管理用户管理注册申请、管理员新建开通帐号设置权限组织管理将将用户分组管理，可统一给组织成员设置权限角色管理角色是权限的集合，可统一给角色成员设置权限授权方式2种：在组织、角色、用户上对其授权在站点、频道、单篇文档上，将权限授予某个组织、角色或用户；权限分类：站点级：站点、栏目、文档、模板、系统类；频道级：栏目、文档、模板类；文档级：单篇文档(5)工作流管理工作流是系统中用来控制文档流转的自定义流程。将定制的工作流设置到栏目上，则栏目中的文档会自动按照定制的工作流自动流转。工作流包括系统级和站点级的；系统级：分别建立在文字库、图片库和视频库中，供某一类型站点的栏目

使用；站点级：建立在各个站点中，只供各自站点下的栏目使用。L援■一股一洎alt注意】并联审批、•会卷、指定接收规则以及规则的定义请参考手册。富惠 趣里市・迷由凤玷菅二过站点父患目：死闻中心切洋看：M栏目炎盟：学通栏目TOC\o"1-5"\h\z唯一行避!鸿东背词 I”显示名窗:龈株国 ”希一个栏目：餐前面 vLjS^ifiE首页版旧：通用观范蒯克（I横情：通用锵区拜就在立;月府一回牝许世加震栏目

2.2web前端学习html语言这是一种超文本标记语言，标准通用标记语言下的一个应用。“超文本”就是指页面内可以包含图片、链接，甚至音乐、程序等非文字元素。超文本标记语言的结构包括“头”部分（英语：Head）、和“主体”部分（英语：Body），其中“头”部提供关于网页的信息，“主体”部分提供网页的具体内容。超级文本标记语言文档制作不是很复杂，但功能强大，支持不同数据格式的文件镶入，这也是万维网（WWW）盛行的原因之一，其主要特点如下：简易性：超级文本标记语言版本升级采用超集方式，从而更加灵活方便。可扩展性：超级文本标记语言的广泛应用带来了加强功能，增加标识符等要求，超级文本标记语言采取子类元素的方式，为系统扩展带来保证。平台无关性：虽然个人计算机大行其道，但使用MAC等其他机器的大有人在，超级文本标记语言可以使用在广泛的平台上，这也是万维网（WWW）盛行的另一个原因。通用性：另外，HTML是网络的通用语言，一种简单、通用的全置标记语言。它允许网页制作人建立文本与图片相结合的复杂页面，这些页面可以被网上任何其他人浏览到，无论使用的是什么类型的电脑或浏览器。一个网页对应多个HTML文件，超文本标记语言文件以.htm（磁盘操作系统DOS限制的外语缩写）为扩展名或.html（外语缩写）为扩展名。可以使用任何能够生成TXT类型源文件的文本编辑器来产生超文本标记语言文件，只用修改文件后缀即可。标准的超文本标记语言文件都具有一个基本的整体结构，标记一般都是成对出现（部分标记除外例如：<^/>），即超文本标记语言文件的开头与结尾标志和超文本标记语言的头部与实体两大部分。有三个双标记符用于页面整体结构的确认。标记符<html>,说明该文件是用超文本标记语言（本标签的中文全称）来描述的，它是文件的开头;而</html>,则表示该文件的结尾，它们是超文本标记语言文件的开始标记和结尾标记。头部内容<head></head>；这2个标记符分别表示头部信息的开始和结尾。头部中包含的标记是页面的标题、序言、说明等内容，它本身不作为内容来显示，但影响网页显示的效果。头部中最常用的标记符是标题标记符和meta标记符，其中标题标记符用于定义网页的标题，它的内容显示在网页窗口的标题栏中，网页标题可被浏览器用作书签和收藏清单。设置文档标题和其它在网页中不显示的信息，比如direction方向、语言代码LanguageCode（实体定义!ENTITY%i18n）、指定字典中的元信息、等等。以下表格列出了HTMLhead元素：[3]<body></body>；，网页中显示的实际内容均包含在这2个正文标记符之间。正文标记符又称为实体标记。css样式级联样式表是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。CSS目前最新版本为CSS3,是能够真正做到网页表现与内容分离的一种样式设计语言。相对于传统HTML的表现而言，CSS能够对网页中的对象的位置排版进行像素级的精确控制，支持几乎所有的字体字号样式，拥有对网页对象和模型样式编辑的能力，并能够进行初步交互设计，是目前基于文本展示最优秀的表现设计语言。CSS能够根据不同使用者的理解能力，简化或者优化写法，针对各类人群，有较强的易读性。有三种方法可以在站点网页上使用样式表：外部样式：将网页链接到外部样式表。内页样式：在网页上创建嵌入的样式表。行内样式：应用内嵌样式到各个网页元素。每一种方法均有其优缺点：当要在站点上所有或部分网页上一致地应用相同样式时，可使用外部样式表。在一个或多个外部样式表中定义样式，并将它们链接到所有网页，便能确保所有网页外观的一致性。如果人们决定更改样式，只需在外部样式表中修改一次，而该更改会反映到所有与该样式表相链接的网页上。当人们只是要定义当前网页的样式，可使用嵌入的样式表。嵌入的样式表是一种级联样式表，“嵌”在网页的<HEAD>标记符内。如果网页链接到外部样式表，为网页所创建的内嵌的或嵌入式样式将扩充或覆盖外部样式表中的指定属性。要在网页上使用外部样式表的样式，可将该网页链接到样式表，方法是使用位于“格式”菜单上的“样式表连接”命令。可以链接一个或数个样式表到网页视图模式下的当前网页，或到在文件夹列表中的所选网页，或到站点上的全部网页。该“样式”框列出标准HTML标记符，还有嵌入的样式表或链接到网页的外部样式表中所含的类或ID选择器。要应用样式到网页元素，请选定该样式然后单击“样式”框中的样式或选择器。在MicrosoftFrontPage2000中，某些格式设置特性会作为内嵌样式自动应用。例如：如果使用“边框与阴影”命令（在“格式”菜单上）在普通段落周围应用框，FrontPage会写下格式设置信息，作为段落标记符的内嵌样式属性（例如：＜pstyle="border-style：solid"＞）。然而某些属性的应用需要使用CSS,其他则需要使用HTML。如果人们只想使用CSS应用内嵌样式，可使用“样式”按钮（位于网页元素的“属性”对话框里）应用类或ID选择器或嵌入式样式。至于css的布局特点，对于蜘蛛在爬行一个网站的页面时，若是有太多的垃圾代码，会使搜索蜘蛛对其产生不友好、不信任感，同时蜘蛛的爬行速度也会因此而减缓，对于网站5£0而言，可谓一大忌。就如传统的用table页面，对此我们就需要对网站进行代码优化，而这便需要动用CSS+div了，下面便来谈谈使用CSS+div进行代码优化的一些益处。①精简代码，降低重构难度。网站使用DIV+CSS布局使代码很是精简，相信大多朋友也都略有所闻，css文件可以在网站的任意一个页面进行调用，而若是使用table表格修改部分页面却是显得很麻烦。要是一个门户网站的话，需手动改很多页面，而且看着那些表格也会感觉很乱也很浪费时间，但是使用css+div布局只需修改css文件中的一个代码即可。②网页访问速度使用yDIV+CSS布局的网页与Table布局比较，精简了许多页面代码，那么其浏览访问速度自然得以提升，也从而提升了网站的用户体验度。③SEO优化采用div-css布局的网站对于搜索引擎很是友好，因此其避免了Table嵌套层次过多而无法被搜索引擎抓取的问题，而且简洁、结构化的代码更加有利于突出重点和适合搜索引擎抓取。④浏览器兼容性DIV+CSS相比TABLE布局，更容易出现多种浏览器不兼容的问题，主要原因是不同的浏览器对web标准默认值不同。国内主流是ie,firefox及chrome用的较少，在兼容性测试方面，首先需要保证在ie多版本不出现问题，这里涉及到一些方法和技巧，可以针对具体问题在网站查找解决办法。⑤CSS+DIV网页布局的时候常犯的小错误.检查HTML元素是否有拼写错误、是否忘记结束标记即使是老手也经常会弄错div的嵌套关系。可以用dreamweaver的验证功能检查一下有无错误。.检查CSS是否书写正确检查一下有无拼写错误、是否忘记结尾的｝等。可以利用CleanCSS来检查CSS的拼写错误。CleanCSS本是为CSS减肥的工具，但也能检查出拼写错误。.用删除法确定错误发生的位置如果错误影响了整体布局，则可以逐个删除div块，直到删除某个div块后显示恢复正常，即可确定错误发生的位置。.利用border属性确定出错元素的布局特性使用float属性布局一不小心就会出错。这时为元素添加border属性确定元素边界，错误原因即水落石出。.float元素的父元素不能指定clear属性MacIE下如果对float的元素的父元素使用clear属性，周围的float元素布局就会混乱。这是MacIE的著名的bug，倘若不知道就会走弯路。.float元素务必指定width属性很多浏览器在显示未指定width的float元素时会有bug。所以不管float元素的内容如何，一定要为其指定width属性。另外指定元素时尽量使用em而不是px做单位。.float元素不能指定margin和padding等属性IE在显示指定了margin和padding的float元素时有6口且。因此不要对float元素指定margin和padding属性（可以在float元素内部嵌套一个div来设置margin和padding）。也可以使用hack方法为IE指定特别的值。8.float元素的宽度之和要小于100%如果float元素的宽度之和正好是100%，某些古老的浏览器将不能正常显示。因此请保证宽度之和小于99%。.是否重设了默认的样式？某些属性如margin、padding等，不同浏览器会有不同的解释。因此最好在开发前首先将全体的margin、padding设置为0、列表样式设置为none等。.是否忘记了写DTD?如果无论怎样调整不同浏览器显示结果还是不一样，那么可以检查一下页面开头是不是忘了写下DTD声明。最后，需要注意的是，蜘蛛不喜欢一个页面有太多的css代码，否则同样会影响蜘蛛的爬行，影响搜索引擎的收录，所以采用外部调用的方式调用CSS是非常不错的方法。而同时，若非必须太多花哨的网站，采用CSS布局，同样可以到达所想要的效果。如网站导航中的文字颜色变化、下拉菜单等。2.2.3javascript语言JavaScript是一种属于网络的脚本语言，已经被广泛用于Web应用开发，常用来为网页添加各式各样的动态动能，为用户提供更流畅美观的浏览效果。通常JavaScript脚本是通过嵌入在HTML中来实现自身的功能的。[3]是一种解释性脚本语言（代码不进行预编译）。[4]主要用来向HTML（标准通用标记语言下的一个应用）页面添加交互行为。[4]可以直接嵌入HTML页面，但写成单独的js文件有利于结构和行为的分离。[4]跨平台特性，在绝大多数浏览器的支持下，可以在多种平台下运行(如Windows、Linux、Mac、Android、iOS等)。Javascript脚本语言同其他语言一样，有它自身的基本数据类型，表达式和算术运算符及程序的基本程序框架。Javascript提供了四种基本的数据类型和两种特殊数据类型用来处理数据和文字。而变量提供存放信息的地方，表达式则可以完成较复杂的信息处理。JavaScript脚本语言具有以下特点：(1)脚本语言。JavaScript是一种解释型的脚本语言工、C++等语言语言现先编译后执行，而JavaScript是在程序的运行过程中逐行进行解释。⑵基于对象。JavaScript是一种基于对象的脚本语言，它不仅可以创建对象，也能使用现有的对象。⑶简单。JavaScript语言中采用的是弱类型的变量类型，对使用的数据类型未做出严格的要求，是基于Java基本语句和控制的脚本语言，其设计简单紧凑。(4)动态性。JavaScript是一种采用事件驱动的脚本语言，它不需要经过Web服务器就可以对用户的输入做出响应。在访问一个网页时,鼠标在网页中进行鼠标点击或上下移、窗口移动等操作JavaScript都可直接对这些事件给出相应的响应。⑸跨平台性。JavaScript脚本语言不依赖于操作系统，仅需要浏览器的支持。因此一个JavaScript脚本在编写后可以带到任意机器上使用,前提上机器上的浏览器支持JavaScript脚本语言，目前JavaScript已被大多数的浏览器所支持。不同于服务器端脚本语言，例如PHP与ASP，JavaScript主要被作为客户端脚本语言在用户的浏览器上运行，不需要服务器的支持。所以在早期程序员比较青睐于JavaScript以减少对服务器的负担，而与此同时也带来另一个问题：安全性。而随着服务器的强壮，虽然现在的程序员更喜欢