Javascript + Xslt 解析Xml为Html的方法
Javascript + Xslt 解析Xml为Html的方法
2009年09月28日星期一 17:57
如果之前使用过asp的朋友应该知道，Msxml2.FreeThreadedDOMDocument.3.0，
Msxml2.XSLTemplate.3.0等结合使用可以用于解析Xml为自定义的样式，比如特定的XML，只不过VBScript通过Server.CreateObject方法，而Javascript则使用ActiveObject
创建这些对象的方法如下
下面的代码摘自我的最近的一个项目中的，整个项目页面展示基本都用Xslt来解析XML数据，在后台直接通过XsltTransform类，而在前台一些页面，则采用了Javascript来实现
function openBdp(bdpID,name)
{
var xslt = new ActiveXObject("Msxml2.XSLTemplate.3.0");
var xslDoc = new ActiveXObject("Msxml2.FreeThreadedDOMDocument.3.0");
var xmlDom =new ActiveXObject("Msxml2.FreeThreadedDOMDocument.3.0");
xslDoc.async = false;
xmlDom.async = false;
xslDoc.load('../Templates/test.xslt');
xmlDom.loadXML($get('dealInfoXml').value);
xslt.stylesheet = xslDoc;
var xslProc = xslt.createProcessor();
xslProc.input=xmlDom;
//添加参数
xslProc.addParameter("bdpTypeName", name);
//转换
xslProc.transform();
//将转换结果设置为一个div的innerHTML
$get('iframeContainer').innerHTML=xslProc.output;
showPopup('ModalPopupShowDealDetail','预处理详情查看','popupTitle');
}//end function
Templates/test.xslt'代码如下：
...
| 类别 | 分类名称 | 测试结果 | 标准值 | 结论 |
Xml数据类似于：
最终解析的结果
JavaScript常用知识点
1、GET和POST的区别，何时使用POST？ GET：一般用于信息获取，使用URL传递参数，对所发送信息的数量也有限制，一般在2000个字符 POST：一般用于修改服务器上的资源，对所发送的信息没有限制。 GET方式需要使用Request.QueryString来取得变量的值，而POST方式通过Request.Form来获取变量的值， 也就是说Get是通过地址栏来传值，而Post是通过提交表单来传值。 然而，在以下情况中，请使用POST 请求： 无法使用缓存文件（更新服务器上的文件或数据库） 向服务器发送大量数据（POST 没有数据量限制） 发送包含未知字符的用户输入时，POST 比GET 更稳定也更可靠JavaScript是客户端和服务器端脚本语言，可以插入到HTML页面中，并且是目前较热门的Web开发语言。同时，JavaScript也是面向对象编程语言。 类似的基本题目还包括：JavaScript都有哪些类型?JavaScript是谁发明的?……2、列举Java和JavaScript之间的区别? Java是一门十分完整、成熟的编程语言。相比之下，JavaScript是一个可以被引入HTML页面的编程语言。这两种语言并不完全相互依赖，而是针对不同的意图而设计的。Java是一种面向对象编程(OOPS)或结构化编程语言，类似的如C ++或C，而JavaScript是客户端脚本语言，它被称为非结构化编程。
3. JavaScript和ASP脚本相比，哪个更快? JavaScript更快。JavaScript是一种客户端语言，因此它不需要Web服务器的协助来执行。另一方面，ASP是服务器端语言，因此总是比JavaScript慢。值得注意的是，Javascript现在也可用于服务器端语言(nodejs)。 4、什么是负无穷大? 负无穷大是JavaScript中的一个数字，可以通过将负数除以零来得到。 5、如何将JavaScript代码分解成几行吗? 在字符串语句中可以通过在第一行末尾使用反斜杠“\”来完成 例：document.write(“This is \a program”); 如果不是在字符串语句中更改为新行，那么javaScript会忽略行中的断点。
4：JavaScriptjavaDOM
JavaScript制作页面特效课后练习 1．在某页面中有一个图片和五个超链接，如下图所示，单击不同的数字超链接显示不同的 图片： 图1 图片幻灯片显示效果 提示： （1）默认显示一个图片，五个超链接调用同一个传参函数，参数设置为显示图片的名称。 （2）使用“对象名.属性值”或setAttribute()的方式改变图片的名称。 2．做一个模仿删除用户的页面，功能如下： 默认情况下，在一个Table 里面放置若干用户信息，后面有“删除”链接：
图2 模仿删除用户的页面效果1 点击“删除”链接，弹出对话框，提示用户是否继续操作： 图3 模仿删除用户的页面效果2 用户点击确定后，要删除的一行，自动加上删除线，表示处于删除状态： 图4 模仿删除用户的页面效果3 提示： （1）使用confirm 弹出确认框，如果用户点击“确定”，则返回true，进行下一步操作； （2）定义一个类样式，用来标识删除状态，如果用户点击了“确定”按钮之后，该行所对 应的tr 标签，自动应用该类样式。 3．做一个横向导航菜单，并且每一项均包含一个二级的菜单，效果图如下：
图5 横向导航菜单 当鼠标不在菜单上时，二级菜单不显示，当鼠标移动到任一项上时，显示该项对应的二级菜 单。 提示： （1）使用对象的display 属性可以控制对象的显示与隐藏； （2）使用相对定位/绝对定位来控制二级菜单的显示位置； （3）使用鼠标的两个事件（onmouseove/onmouseout）来触发控制函数。 4．做一个横向不间断滚动的特效，效果图如下：
图6 图片横向滚动特效 要求：图片始终横向向左滚动，并且每一张图片首尾相连，不存在间断。 提示： （1）若要使图片不间断，则需要将图片列表重复一次，这样第一遍的末尾图片和第二遍的 开始图片就能相连了，即使用innerHTML 属性让图片内容翻倍；（2）使用setInterval()方法，可以控制一个函数每隔多少毫秒执行一次； （3）使用绝对定位与相对定位结合，可以使图片所在的层相对于父层的位置可控，方便随 着计时器的执行，left 的值递减；
Javascript笔试题及答案
J a v a s c r i p t笔试题及 答案 Company Document number：WTUT-WT88Y-W8BBGB-BWYTT-19998
Javascript面试笔试题 考试时间90分钟 一、不定项选择题（每题3分，共30分） 1.声明一个对象，给它加上name属性和show方法显示其name值，以下 代码中正确的是（ D ） A.var obj = [name:"zhangsan",show:function(){alert(name);}]; B.var obj = {name:"zhangsan",show:”alert”}; C.var obj = {name:"zhangsan",show:function(){alert(name);}}; D.v ar obj = {name:"zhangsan",show:function(){alert;}}; 2.以下关于Array数组对象的说法不正确的是（ CD） A.对数组里数据的排序可以用sort函数，如果排序效果非预期，可以给 sort函数加一个排序函数的参数 B.reverse用于对数组数据的倒序排列 C.向数组的最后位置加一个新元素，可以用pop方法 D.unshift方法用于向数组删除第一个元素 3.要将页面的状态栏中显示“已经选中该文本框”，下列JavaScript语句正确的 是（ A ） A.="已经选中该文本框" B.="已经选中该文本框" C.="已经选中该文本框" D.="已经选中该文本框" 4.点击页面的按钮，使之打开一个新窗口，加载一个网页，以下JavaScript 代码中可行的是（ AD）
《HTML CSS JavaScript网页制作案例教程》_教学大纲讲解
《HTML+CSS+JavaScript网页制作案例教程》课程教学大纲 （课程英文名称） 课程编号：201509210011 学分：5学分 学时：64学时（其中：讲课学时：45 上机学时： 19 ） 先修课程：计算机基础、计算机网络、计算机应用 后续课程：UI设计、 JavaScript网页特效 适用专业：信息及其计算机相关专业 开课部门：计算机系 一、课程的性质与目标 《HTML+CSS+JavaScript网页制作案例教程)》是面向计算机相关专业的一门专业基础课，涉及网页基础、HTML标记、CSS样式、网页布局、JavaScript 编程基础与事件处理等内容。通过本课程的学习，学生能够了解HTML、CSS及JavaScript语言的发展历史及未来方向，熟悉网页制作流程、掌握常见的网页布局效果、学会制作各种企业、门户、电商类网站。 二、课程的主要内容及基本要求 第一章网页那点事（2学时） [知识点] 认识网页 常见的互联网专业术语 Web标准 HTML简介 CSS简介 JavaScript简介 常用浏览器介绍 Dreamweaver 工具的使用
使用Dreamweaver创建第一个页面 [重点] Web标准 Dreamweaver工具的使用 [难点] Web标准 Dreamweaver工具创建第一个页面 [基本要求] 了解Web标准，明确HTML、CSS及JavaScript在其中的作用。 熟悉Dreamweaver工具的基本操作，能使用Dreamweaver创建简单的网页。第二章从零开始构建HTML页面（4学时） [相关案例] 【案例1】简单的网页： 【案例2】新闻页面： 【案例3】图文混排： [知识点] HTML文档基本格式
网页设计与制作项目教程(HTML+CSS+JavaScript)(一般)
《网页设计与制作项目教程（）（一般）》试卷 得分 一、单选题（每题2分，共计30分） 1．关于<>标记的描述，下列选项中正确的是（）。（） A、是表格中的单元格标记 B、可以单独使用 C、是表格中的行标记 D、没有属性 2．若超链接的属性，需要链接到页面中的锚点，以下书写正确的是（）（） A、 B、 C、 D、 3．中，通过链接伪类可以实现不同的链接状态。下列用来定义未访问时超链接状态的是（）（）A、 B、 C、 D、4．下列有关样式，说法正确的是（）。（） A、样式必须写在一对;标签内部 B、用于设置页面中的文本内容、图片的外形以及版面的布局等外观显示样式 C、只有外部的文件才是符合结构与表现分离的特点 D、目前流行的版本为3 5．下列样式代码中，可以实现相对定位模式的是（）。（） A、: ; B、: ; C、: ; D、: ; 6．关于样式代码“{:200; :15; :20;}”下列说法正确的是（）。（） A、的总宽度为200 B、的总宽度为270 C、的总宽度为235 D、以上说法均错误 7．关于行内式引入样式表，以下书写正确的是（）（） A、 :12; ;段落文本; B、 :12, ;段落文本; C、 :12; ;段落文本; D、 :12; ;段落文本; 8．使用标签指定式选择器，让段落应用名为的类，下列写法正确的是( )（） 总分题号一二三四五题分 得分
A、 {;} B、{;} C、{;} D、{;} 9．下列选项中，调用名为"" 的函数正确的是（）（） A、 B、() C、() D、 10．认真阅读下面代码，并按要求进行作答。1=" a "2=" "312;根据上述代码，3的运算结果是（）（） A、 B、 C、 D、 11．关于有序列表的描述，下列说法正确的是（）（） A、有序列表没有排列顺序 B、有序列表按顺序排列，并不带有序号 C、有序列表按顺序排列并通过属性定义序号样式 D、有序列表不可以和无序列表嵌套使用 12．若要在网页中插入样式表，以下用法中正确的是（）（） A、; B、; C、; D、; 13．下列选项中，用于删除当前节点的子节点的方法是（）（） A、() B、() C、() D、() 14．以下属性中，不能增加盒子尺寸的属性是（）。（） A、 B、 C、 D、 15．网页程序设计中，运行下面的代码，则对话框中将显示（）。< ""> 3 2 (2)(z);<>（） A、2 B、2.5 C、5 D、16 得分 二、多选题（每题3分，共计15分）
四种XML解析器比较
1.详解 1）DOM（JAXP Crimson解析器） DOM是用与平台和语言无关的方式表示XML文档的官方W3C标准。DOM是以层次结构组织的节点或信息片断的集合。这个层次结构允许开发人员在树中寻找特定信息。分析该结构通常需要加载整个文档和构造层次结构，然后才能做任何工作。由于它是基于信息层次的，因而DOM被认为是基于树或基于对象的。DOM以及广义的基于树的处理具有几个优点。首先，由于树在内存中是持久的，因此可以修改它以便应用程序能对数据和结构作出更改。它还可以在任何时候在树中上下导航，而不是像SAX那样是一次性的处理。DOM使用起来也要简单得多。 2）SAX SAX处理的优点非常类似于流媒体的优点。分析能够立即开始，而不是等待所有的数据被处理。 而且，由于应用程序只是在读取数据时检查数据，因此不需要将数据存储在内存中。这对于大型文档来说是个巨大的优点。事实上，应用程序甚至不必解析整个文档；它可以在某个条件得到满足时停止解析。一般来说，SAX还比它的替代者DOM快许多。 选择DOM还是选择SAX？对于需要自己编写代码来处理XML文档的开发人员来说，选择DOM 还是SAX解析模型是一个非常重要的设计决策。 DOM采用建立树形结构的方式访问XML文档，而SAX采用的事件模型。 DOM解析器把XML文档转化为一个包含其内容的树，并可以对树进行遍历。用DOM解析模型的优点是编程容易，开发人员只需要调用建树的指令，然后利用navigation APIs访问所需的树节点来完成任务。可以很容易的添加和修改树中的元素。然而由于使用DOM解析器的时候需要处理整个XML文档，所以对性能和内存的要求比较高，尤其是遇到很大的XML文件的时候。由于它的遍历能力，DOM解析器常用于XML文档需要频繁的改变的服务中。 SAX解析器采用了基于事件的模型，它在解析XML文档的时候可以触发一系列的事件，当发现给定的tag的时候，它可以激活一个回调方法，告诉该方法制定的标签已经找到。SAX对内存的要求通常会比较低，因为它让开发人员自己来决定所要处理的tag.特别是当开发人员只需要处理文档中所包含的部分数据时，SAX这种扩展能力得到了更好的体现。但用SAX解析器的时候编码工作会比较困难，而且很难同时访问同一个文档中的多处不同数据。 3）JDOM https://www.wendangku.net/doc/0c31662.html, JDOM的目的是成为Java特定文档模型，它简化与XML的交互并且比使用DOM实现更快。由于是第一个Java特定模型，JDOM一直得到大力推广和促进。正在考虑通过“Java规范请求JSR-102” 将它最终用作“Java标准扩展”。从2000年初就已经开始了JDOM开发。 JDOM与DOM主要有两方面不同。首先，JDOM仅使用具体类而不使用接口。这在某些方面简化了API，但是也限制了灵活性。第二，API大量使用了Collections类，简化了那些已经熟悉这些类的Java开发者的使用。 JDOM文档声明其目的是“使用20%（或更少）的精力解决80%（或更多）Java/XML问题”（根据学习曲线假定为20%）。JDOM对于大多数Java/XML应用程序来说当然是有用的，并且大多数开
web开发知识练习(HTML标签和JavaScript脚本)
网上客服培训考核 －－－阶段二HTML标签和JavaScript脚本 试题类型：HTML标签和JavaScript脚本 考核类型：开卷
1. HTML（Hypertext Markup Language超文本标记语言）是一种用来制作超文本文 档的简单标记语言。利用各种标记（tags）来标识文档的结构以及标识超链（Hyperlink）的信息 2.HTML的标记总是封装在由 < 和 > 构成的一对尖括号之中。 除少数几个转义序列之外，HTML标记忽略大小写，即
、
、、
等众多的标记它们所定义的文本、图像等将会在浏览器的框内显示出来，标记中还可以有很多属性，以下是主要的几种设置背景颜色bgcolor =”颜色码”，设置文本颜色 text = “颜色码”，设置链接颜色 link = “颜色码”，设置已使用的链接的颜色 vlink = “颜色码”，设置正在被击中的链接的颜色 alink = “颜色码”。 7.
……，一共有六对标题的标记对 13.用来使文本以粗体效果的形式输出； 14.用来使文本以斜体效果的形式输出； 15.用来使文本以带下划线的形式输出。 16.则用来输出加重语气文本(通常也是斜体加黑体)。 17. 是一对很有用的标记对，它可以对输出文本的字体大小、颜色进 行随意地改变，这些改变主要是通过对它的两个属性 size 和 color 的控制来实现的。 size属性用来改变字体的大小，取值范围从1到7；而color属性则用来改变文本的颜色 18. ![]()
是单标记，它通过src属性指定当前位置要插入的图像文件,标记还有alt、Javascript笔试题及答案
Javascript面试笔试题 考试时间90分钟 一、不定项选择题（每题3分，共30分） 1.声明一个对象，给它加上name属性和show方法显示其name值，以下代码中正确 的是（ D ） A.var obj = [name:"zhangsan",show:function(){alert(name);}]; B.var obj = {name:"zhangsan",show:”alert(https://www.wendangku.net/doc/0c31662.html,)”}; C.var obj = {name:"zhangsan",show:function(){alert(name);}}; D.var obj = {name:"zhangsan",show:function(){alert(https://www.wendangku.net/doc/0c31662.html,);}}; 2.以下关于Array数组对象的说法不正确的是（CD） A.对数组里数据的排序可以用sort函数，如果排序效果非预期，可以给sort函数加 一个排序函数的参数 B.reverse用于对数组数据的倒序排列 C.向数组的最后位置加一个新元素，可以用pop方法 D.unshift方法用于向数组删除第一个元素 3.要将页面的状态栏中显示“已经选中该文本框”，下列JavaScript语句正确的是（ A ） A.window.status="已经选中该文本框" B.document.status="已经选中该文本框" C.window.screen="已经选中该文本框" D.document.screen="已经选中该文本框" 4.点击页面的按钮，使之打开一个新窗口，加载一个网页，以下JavaScript代码中可行 的是（AD） A. B. C. D.
5.使用JavaScript向网页中输出hello
，以下代码中可行的是（BD） A. B. C. D.关于JavaScript DOM的学习总结
关于JavaScript的学习总结 通过对《JavaScript DOM编程艺术》这本书的学习，总共学习到三大部分的内容：JavaScript1,JavaScript DOM和CSS样式表。CSS和JavaScript 都是通过控制页面标签的方式，来完善页面，使页面更美观，内容更丰富。 一、JavaScript部分 1．关于JavaScript js脚本语言 JavaScript一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置支持类型。它的解释器被称为JavaScript引擎，为浏览器的一部分，广泛用于客户端的脚本语言，最早是在HTML（标准通用标记语言下的一个应用）网页上使用，用来给HTML网页增加动态功能。 2．JS变量 2.1 JS的变量为易变量，没有类型的限制可以等于所有的类型。 2.2 JS变量的命名规则和java相同，且区分大小写。 JS的数据类型有7种：Number 数字类型、String 字符串类型、Boolean 布尔类型、Array 数组类型、Object 对象、Null 空对象、Undefined 未定义。 2.3 变量的声明，直接用var关键字声明即可：var a=90。也可以一次性声明多个变量：var b=1,c=2,d=3。如果一个变量没有声明就使
用，或是声明了没有设置值都是undefined。 3．数据类型的定义 数值类型: var age=33; 字符串类型: var mood=”happy” 布尔值类型: var add=true; 数组类型: var list= Array(2) list[0]=”jhon”; list[1]=33; 或者: var list=Array(“jhon”,33) (注:数组内可定义任意类型的数据,且数组下标从0 开始) NULL类型: var name=null ;或name=””; Undefined类型: var person; 对象类型: var jer= new person; 对象类型是一种非常重要的数据类型.对象是自我包含的数据集合,包含在对象里的数据可以通过两种方式--属性(property)和方法(method) 访问 例如: person.age Math.round() 4．JS操作符 算数操作符:加法(+),减法(-),乘法(*),除法(/) 如: var num=1+1; var num=num-1; var num=num*num; var num=num/2;
JAVASCRIPT
Javascript 114、alert怎样换行? \r\n 115、什么情况用HTML控件，什么情况用WEB控件，并比较两者差别 如果有数据提交到server端时用web control好。一般为了提高效率能用html control在客户端执行，就用html control。 116、JavaScript中的对象. JavaScript中的Object是一组数据的key-value的集合,有点类似于Java中的有这些数据都是Object里的property.通常情况下,JavaScript中建立一个对象用”new”加上constructor function来实现.如new Date(),new Object()等. var book=new Object(); https://www.wendangku.net/doc/0c31662.html,="JavaScript is Cool"; book.author="tom"; book.pages=514; 上面例子中的name和page就是名为book的对象中的property.我们可以用delete 来删除Object中的property:“delete https://www.wendangku.net/doc/0c31662.html,;”.除了Object,Date等buildin 的对象外,我们可以写自己的constructor function,然后使用new就可以建立自己的对象.如上面的book可以写成: function Book(name,author,page){ https://www.wendangku.net/doc/0c31662.html,=name; this.author=author; this.page=page; } var abook=new Book("JavaScript is Cool","tom",514); 117、function的用法 在JavaScript中,function是一种数据类型,所有的function都是从buildin的Function object衍生的对象.所以在JavaScript中function可以作为参数传递,可以作为Object的property,也可以当作函数返回值.function在JavaScript中有两种用法,一种是当作constructor,前面加上new keyword用来建立对象.一种是当作method,为其他对象调用. 注意function和method在中文里的意思相当,在有些语言里也可以通用.但是在JavaScript中,它们还是有所区别的.function本身是是一个对象,而当作为一个方法他属于一个对象时,就成为了一个这个对象的method,相当于一个对象种的属性.也就是说method是相对于一个对象而言的,function在某些情况下成为了一个对象的method. function Book(name,author,page){ https://www.wendangku.net/doc/0c31662.html,=name; this.author=author; this.page=page;
javascript_dom
什么是DOM？ 通过JavaScript，您可以重构整个HTML文档。您可以添加、移除、改变或重排页面上的项目。 要改变页面的某个东西，JavaScript就需要对HTML文档中所有元素进行访问的入口。这个入口，连同对HTML元素进行添加、移动、改变或移除的方法和属性，都是通过文档对象模型来获得的（DOM）。 在1998年，W3C发布了第一级的DOM规范。这个规范允许访问和操作HTML页面中的每一个单独的元素。 所有的浏览器都执行了这个标准，因此，DOM的兼容性问题也几乎难觅踪影了。 DOM可被JavaScript用来读取、改变HTML、XHTML以及XML文档。 DOM被分为不同的部分（核心、XML及HTML）和级别（DOM Level 1/2/3）： Core DOM 定义了一套标准的针对任何结构化文档的对象 XML DOM 定义了一套标准的针对XML文档的对象 HTML DOM 定义了一套标准的针对HTML文档的对象。 HTML DOM 节点 HTML文档中的每个成分都是一个节点。 节点 根据DOM，HTML文档中的每个成分都是一个节点。 DOM是这样规定的： ?整个文档是一个文档节点 ?每个HTML标签是一个元素节点 ?包含在HTML元素中的文本是文本节点 ?每一个HTML属性是一个属性节点
注释属于注释节点 Node 层次 节点彼此都有等级关系。 HTML文档中的所有节点组成了一个文档树（或节点树）。HTML文档中的每个元素、属性、文本等都代表着树中的一个节点。树起始于文档节点，并由此继续伸出枝条，直到处于这棵树最低级别的所有文本节点为止。 文档树（节点数） 请看下面这个HTML文档：