<html>
<head>
</head>
<body>
<button onclick=”person1.introduce()”>person1</button>
<button onclick=”person2.introduce()”>person2</button>
<button onclick=”person3.introduce()”>person3</button>
<button onclick=”person4.introduce()”>person4</button>
<button onclick=”checkFunc()”>checkFunc</button>
<button onclick=”checkFuncByProto()”>checkFuncByProto</button><br/>
<button onclick=”testCnstrct()”>testCnstrct</button>
<button onclick=”testCnstrctpttp()”>testCnstrctpttp</button>
<button onclick=”testDbproto()”>testDbproto</button>
<button onclick=”JSONFontI()”>JSONFontI</button>
<button onclick=”JSONFontII()”>JSONFontII</button><br/>
<button onclick=”testFactory()”>testFactory</button>
<button onclick=”testAbstractFactory()”>testAbstractFactory</button>
<script>
var name = “1111111111”
/********************************************/
/* 第一种构建对象的办法*/
/* ***推断***,{}即为对象.*/
/********************************************/
var person1 = {};
person1.name = “junzi”;
person1.age = 23;
person1.introduce = function () {
alert(“My name is ” + this.name + “.I’m ” + this.age);
};
/********************************************/
/* 第二种构建对象的办法,类似JSON格式”:”*/
/********************************************/
var person2 = {
name: “junzi”,
age: 23,
introduce: function () {
alert(“My name is ” + this.name + “.I’m ” + this.age);
}
};
/********************************************/
/* 第三种构建对象的办法,与Java中有些相似*/
/********************************************/
var Person = function () {
this.name = “junzi”;
this.age = 23;
this.introduce = function () {
alert(“My name is ” + this.name + “.I’m ” + this.age);
};
};
var person3 = new Person();
/********************************************/
/* 第四种构建对象,与第三种类似,只不过参数通过new 构造传入 */
/********************************************/
var Person = function (name, age) {
this.name = name;
this.age = age;
this.introduce = function () {
alert(“My name is ” + this.name + “.I’m ” + this.age);
};
};
var person4 = new Person(“junzi”,23);
/********************************************/
/* 看看实例之间的关系@@ */
/********************************************/
var person5 = new Person(“chaokong”,23);
function checkFunc(){
alert(person4.introduce==person5.introduce);//结果是false,说明introduce有两个实现分别在4和5中
alert(person4.age==person5.age);// 结果是true,说明基本类型的话之比较数值是否相同
alert(person4.name==person5.name);// 如果两个名字值不同,则为false,***推测***在javascript中的变量比较的是值是否相同,而方法被视为对象.于是下边…
}
/********************************************/
/* 通过prototype的方式 */
/********************************************/
var PersonI = function(name,age){
this.name = name;
this.age = age;
}
/*
* 在JavaScript中，prototype对象是实现面向对象的一个重要机制。
* 每个函数就是一个对象（Function），函数对象都有一个子对象,即prototype对象，类是以函数的形式来定义的。
* prototype表示该函数的原型，也表示一个类的成员的集合。
* 在通过new创建一个类的实例对象的时候，prototype对象的成员都成为实例化对象的成员。
* 1、该对象被类所引用，只有函数对象才可引用；
* 2、在new实例化后，其成员被实例化，实例对象方可调用。
* 同时，函数是一个对象，函数对象若直接声明成员，不用被实例化即可调用。
*/
PersonI.prototype.introduce = function(){
alert(“My name is ” + this.name + “.I’m ” + this.age);
}
var person6 = new PersonI(“junzi”,23);
var person7 = new PersonI(“chaokong”,23);
function checkFuncByProto(){
alert(person6.introduce==person7.introduce);//
alert(person6.age==person7.age);
alert(person6.name==person7.name);
}
/********************************************/
/* 研究研究prototype*/
/********************************************/
/*
* JavaScript中创建一个对象分以下几步:
* <1> var p={}; 也就是说，初始化一个对象p。
* <2> p.__proto__=Person.prototype;
* <3> Person.call(p);也就是说构造p，也可以称之为初始化p。
*/
var PersonII = function () { };
//通过prototype创建一个方法
PersonII.prototype.sayHello = function(){
alert(“hello”);
}
var p = new PersonII();
function testCnstrct(){
alert(p.__proto__ === PersonII.prototype);
}
/*
* 首先var p=new PersonII()；可以得出p.__proto__=PersonII.prototype。
* 那么当我们调用p.sayHello()时，首先p中没有sayHello这个属性，
* 于是，他就需要到他的__proto__中去找，也就是PersonII.prototype，
* 而我们在上面定义了PersonII.prototype.sayHello=function(){};
* 于是，就找到了这个方法。
*/
function testCnstrctpttp(){
p.sayHello();
}
/** 继续…原型链 */
PersonII.prototype.age = 23;// 设定PersonII的属性
var Programmer = function () { };// 创建一个新对象Programmer,可以得出pp.__proto__ = Programmer.prototype;
/*
* 设 var tempp = new PersonII();
* ∵ Programmer.prototype = new PersonII();
* ∴ Programmer.prototype = tempp;
*
* ∵ tempp.__proto__ = PersonII.prototype;
* ∴ Programmer.prototype.__proto__ = PersonII.prototype;
* 设 var pp = new Programmer();
* ∴ pp.__proto__ = Programmer.prototype。
* ∴ pp.__proto__.__proto__ = PersonII.prototype。
*
*
* pp中没有sayHello()这个方法,所以到pp.__proto__中查找.
* pp.__proto__(也就是Programmer.prototype,也就是tempp,也就是PersonII(),)也没有sayHello()这个方法,所以到pp.__proto__.__proto__中查找
* pp.__proto__.__proto__也就是PersonII().prototype,在这里存在sayHello()这个方法
*
* age属性是同样的道理,只不过在Programmer.prototype的时候就已经找到age了,所以就不继续往下找了.
*/
/* 这也就是原型链的实现原理。
* 其实prototype只是一个假象，他在实现原型链中只是起到了一个辅助作用，
* 他只是在new的时候有着一定的价值，而原型链的本质，其实在于__proto__！
*/
Programmer.prototype = new PersonII();// ***
Programmer.prototype.writeCode = function () {
alert(“print ‘fuck the js with my jb'”);
};
Programmer.prototype.age = 22;
var pp = new Programmer();
function testDbproto(){
pp.sayHello();
pp.writeCode();
alert(pp.age);
}
/********************************************/
/* JSON格式详细 */
/********************************************/
/* 1. */
var PersonIII = {
create: function (name, age) {
this.name = name;
this.age = age;
},
introduce: function () {
alert(“Hello,My name is ” + this.name + “.I am ” + this.age);
}
}
function JSONFontI(){
/*
* 这样是不行的,因为piii = Person.__proto__,而没有这样的 XXX.__proto___=Person.prototype,所以找不到PersonIII内部的方法
* var piii = new PersonIII()
* piii.create(“junzi”, 23);
* piii.introduce();
*/
PersonIII.create(“junzi”, 23);
PersonIII.introduce();
}
/* 2. */
/* 用X做一个中间变量，使得我们可以访问JSON对象的内部属性。*/
function JSONFontII(){
var x = function(){ };//必须有function()
x.prototype = PersonIII;
var px = new x();
px.create(“junzi”, 23);
px.introduce();
}
/* 3. */
/* 工厂模式 */
var Factory = {
createPersonIII : function (className,name,age) {
var temp = function () {
className.create(name, age);
};
temp.prototype = className;
var result = new temp();
return result;
}
};
function testFactory(){
var person = Factory.createPersonIII(PersonIII,”junzi”,23);
person.introduce();
}
/* 4. */
/* 抽象工厂模式 */
var abstractFactory = {
create: function (className, params) {
var temp = function () {
className.create.apply(this, params);
};
temp.prototype = className;
var result = new temp();
return result;
}
};
function testAbstractFactory(){
var person = abstractFactory.create(PersonIII,[“junzi”,23]);
person.introduce();
}
</script>
</body>
</html>
标签归档：JavaScript
JavaScript 的JSON和数组混杂区分
Javascript代码:
var person = { personalInfo:{} , linkmans:[] , accounts:[] , handlers:[] } ;
等我来解释一下：
首先，person 是一个 json ,它包含四个东东：personalInfo , linkmans, accounts, handlers
接着，personalInfo 是一个 json ,
而 这三个 linkmans, accounts, handlers 都分别为 数组
“javascript 脚本‘不支持此属性或方法’错误”主要原因
出现“javascript 脚本‘不支持此属性或方法’错误”主要有以下几种原因：
1、方法对应的js函数未定义，如
onclick=”select();”
中，
select()
没有定义，或没有把相应的.js文件包含进来，包含的方法：
<script language=”javascript” src=”xxxx.js”></script>。
2、在html中的表单中出现这个问题时，可能是元素的名称和函数的名称相同。这时aspX解释时，会进行把函数当成是元素名，然后认为后面的函数的括号是未定义的函数。如：
<script language=”javascript”>
<!–
function ffff()
… …
end function
–>
</script>
<input name=”aa” type=”button” value=”重置密码” onclick=”ffff();”>
<input name=”ffff” type=”button” value=”sfsdfa” onclick=”ffff();”>
上面这个语句通常就会报“对象不支持此属性或方法”的错误。这时，只需要把name=”ffff”改成别的名字或把函数改成别的名字就正常了。
js动态操作表格
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”
“http://www.w3.org/TR/html4/loose.dtd”>
<html>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″>
<title>js动态操作表格</title>
<script language=”javascript”>
function init(){
_table=document.getElementById(“table”);
_table.border=”1px”;
_table.width=”800px”;
for(var i=1;i<6;i++){
var row=document.createElement(“tr”);
row.id=i;
for(var j=1;j<6;j++){
var cell=document.createElement(“td”);
cell.id=i+”/”+j;
cell.appendChild(document.createTextNode(“第”+cell.id+”列”));
row.appendChild(cell);
}
document.getElementById(“newbody”).appendChild(row);
}
}
function rebulid(){
var beginRow=document.getElementById(“beginRow”).value;/*开始行*/
var endRow=document.getElementById(“endRow”).value;/*结束行*/
/*/*/
var beginCol=document.getElementById(“beginCol”).value;/*开始列*/
var endCol=document.getElementById(“endCol”).value;/*结束列*/
var tempCol=beginRow+”/”+beginCol;/*定位要改变属性的列*/
alert(tempCol);
var td=document.getElementById(tempCol);
for(var x=beginRow;x<=endRow;x++){
for(var i=beginCol;i<=endCol;i++){
if(x==beginRow){
document.getElementById(“table”).rows[x].deleteCell(i+1);
}
else{
document.getElementById(“table”).rows[x].deleteCell(i);
}
}
}
td.rowSpan=(endRow-beginRow)+1;
}
/*添加行，使用appendChild方法*/
function addRow(){
var length=document.getElementById(“table”).rows.length;
/*document.getElementById(“newbody”).insertRow(length);
document.getElementById(length+1).setAttribute(“id”,length+2);*/
var tr=document.createElement(“tr”);
tr.id=length+1;
var td=document.createElement(“td”);
for(i=1;i<4;i++){
td.id=tr.id+”/”+i;
td.appendChild(document.createTextNode(“第”+td.id+”列”));
tr.appendChild(td);
}
document.getElementById(“newbody”).appendChild(tr);
}
function addRow_withInsert(){
var row=document.getElementById(“table”).insertRow(document.getElementById(“table”).rows.length);
var rowCount=document.getElementById(“table”).rows.length;
var countCell=document.getElementById(“table”).rows.item(0).cells.length;
for(var i=0;i<countCell;i++){
var cell=row.insertCell(i);
cell.innerHTML=”新”+(rowCount)+”/”+(i+1)+”列”;
cell.id=(rowCount)+”/”+(i+1);
}
}
/*删除行，采用deleteRow(row Index)*/
function removeRow(){
/* var row=document.getElementById(“2”);
var index=row.rowIndex;
alert(index);*/
document.getElementById(“newbody”).deleteRow(document.getElementById(document.getElementById(“table”).rows.length).rowIndex);
}
/*添加列，采用insertCell(列位置)方法*/
function addCell(){
/*document.getElementById(“table”).rows.item(0).cells.length
用来获得表格的列数
*/
for(var i=0;i<document.getElementById(“table”).rows.length;i++){
var cell=document.getElementById(“table”).rows[i].insertCell(2);
cell.innerHTML=”第”+(i+1)+”/”+3+”列”;
}
}
/*删除列，采用deleteCell(列位置)的方法*/
function removeCell(){
for(var i=0;i<document.getElementById(“table”).rows.length;i++){
document.getElementById(“table”).rows[i].deleteCell(0);
}
}
</script>
</head>
<body onLoad=”init();”>
<table id=”table” align=”center”>
<tbody id=”newbody”></tbody>
</table>
<div>
<table width=”800px” border=”1px” align=”center”>
<tr><td align=”center”><input type=”button” id=”addRow” name=”addRow” onClick=”addRow();” value=”添加行”/></td><td align=”center”><input type=”button” id=”delRow” name=”delRow” onClick=”removeRow();” value=”删除行”/></td></tr>
<tr><td align=”center”><input type=”button” id=”delCell” name=”delCell” onClick=”removeCell();” value=”删除列”/></td><td align=”center”><input type=”button” id=”addCell” name=”addCell” onClick=” addCell();” value=”添加列”/></td></tr>
<tr><td align=”center” colspan=”2″><input type=”button” id=”addRows” name=”addRows” onClick=”addRow_withInsert();” value=”添加行”/></td></tr>
</table>
</div>
<div>
<table width=”800px” border=”1px” align=”center”>
<tr><td>从第<input type=”text” id=”beginRow” name=”beginRow” value=””/>行到<input type=”text” name=”endRow” id=”endRow” value=””/>行</td><td rowspan=”2″ id=”test”><input type=”button” name=”hebing” id=”hebing” value=”合并” onClick=”rebulid();”/></td></tr>
<tr><td>从第<input type=”text” name=”beginCol” id=”beginCol” value=””/>列到<input type=”text” name=”endCol” id=”endCol” value=””/>列</td></tr>
</table>
</div>
</body>
</html>
完美兼容IE、FF、Opera的Ajax类支持get、post、自定义回调函数(转载待测)
Js代码
function Ajax(){
this.httpXML=false;
this.init();
}
Ajax.prototype.init=function(){
if(window.XMLHttpRequest){
this.httpXML=new XMLHttpRequest();
if (this.httpXML.overrideMimeType){
this.httpXML.overrideMimeType(“text/xml”);
}
}else if(window.ActiveXObject){
try{this.httpXML = new ActiveXObject(“Msxml2.XMLHTTP”);}catch (e){
try{this.httpXML = new ActiveXObject(“Microsoft.XMLHTTP”);}catch (e){}
}
}
if(!this.httpXML){
window.alert(“can’t create XMLHttpRequest object”);
return null;
}
}
Ajax.prototype.send=function(_method,_url,_data,_callback){
this.httpXML.onreadystatechange=function(){
if(this.readyState==4&&this.status==200){
_callback.call(this,this.responseText);
}
}
if (_method.toLowerCase() == “get”){
//if(navigator.userAgent.indexOf(“MSIE”)<=0){
// netscape.security.PrivilegeManager.enablePrivilege(“UniversalBrowserRead”);
//}
this.httpXML.open(_method, _url, true);
this.httpXML.send(null);
}else if (_method.toLowerCase() == “post”){
this.httpXML.open(_method, _url, true);
this.httpXML.setRequestHeader(“Content-Type”, “application/x-www-form-urlencoded”);
this.httpXML.send(_data);
}
}
Ajax.prototype.callback=function(){
}function Ajax(){
this.httpXML=false;
this.init();
}
Ajax.prototype.init=function(){
if(window.XMLHttpRequest){
this.httpXML=new XMLHttpRequest();
if (this.httpXML.overrideMimeType){
this.httpXML.overrideMimeType(“text/xml”);
}
}else if(window.ActiveXObject){
try{this.httpXML = new ActiveXObject(“Msxml2.XMLHTTP”);}catch (e){
try{this.httpXML = new ActiveXObject(“Microsoft.XMLHTTP”);}catch (e){}
}
}
if(!this.httpXML){
window.alert(“can’t create XMLHttpRequest object”);
return null;
}
}
Ajax.prototype.send=function(_method,_url,_data,_callback){
this.httpXML.onreadystatechange=function(){
if(this.readyState==4&&this.status==200){
_callback.call(this,this.responseText);
}
}
if (_method.toLowerCase() == “get”){
//if(navigator.userAgent.indexOf(“MSIE”)<=0){
// netscape.security.PrivilegeManager.enablePrivilege(“UniversalBrowserRead”);
//}
this.httpXML.open(_method, _url, true);
this.httpXML.send(null);
}else if (_method.toLowerCase() == “post”){
this.httpXML.open(_method, _url, true);
this.httpXML.setRequestHeader(“Content-Type”, “application/x-www-form-urlencoded”);
this.httpXML.send(_data);
}
}Ajax.prototype.callback=function(){
}
Html代码
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml” >
<head>
<title>完美兼容IE、FF、Opera浏览器</title>
<script type=”text/javascript” src=”js/ajax.js”></script>
<script type=”text/javascript”>
function send(){
ajax=new Ajax();
ajax.send(“get”,”listener/Hajax.ashx”,”post测试请求”,ddd);
}
function ddd(data){
alert(data);
}
</script>
</head>
<body>
<button onclick=”send()”>测试</button>
</body>
</html><!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml” >
<head>
<title>完美兼容IE、FF、Opera浏览器</title>
<script type=”text/javascript” src=”js/ajax.js”></script>
<script type=”text/javascript”>
function send(){
ajax=new Ajax();
ajax.send(“get”,”listener/Hajax.ashx”,”post测试请求”,ddd);
}
function ddd(data){
alert(data);
}
</script>
</head>
<body>
<button onclick=”send()”>测试</button>
</body>
</html>
javascript 读取xml 数据
<?xml version=”1.0″ encoding=”gb2312″?>
<treeview>
<tree id=”p1″>
<text>山东省</text>
<target>_blank</target>
<title>省份</title>
<link></link>
<tree id=”p1-1″>
<text>威海市</text>
<target>_blank</target>
<title>城市</title>
<link></link>
</tree>
<tree id=”p1-2″>
<text>烟台市</text>
<target>_blank</target>
<title>城市</title>
<link></link>
<node id=”p1-2-1″>
<text>长夼村</text>
<target>_blank</target>
<title>乡镇</title>
<link>http://www.baidu.com/</link>
</node>
</tree>
<node id=”p1-3″>
<text>富镇</text>
<target>_blank</target>
<title>乡镇</title>
<link>http://www.baidu.com/</link>
</node>
</tree>
<tree id=”p2″>
<text>河北省</text>
<target>_blank</target>
<title>省份</title>
<link></link>
<tree id=”p2-1″>
<text>泊头市</text>
<target>_blank</target>
<title>城市</title>
<link></link>
<node id=”p2-1-1″>
<text>郊河</text>
<target>_blank</target>
<title>乡镇</title>
<link>http://www.baidu.com/</link>
</node>
</tree>
<tree id=”p2-2″>
<text>石家庄</text>
<target>_blank</target>
<title>城市</title>
<link></link>
</tree>
</tree>
<tree id=”p3″>
<text>浙江省</text>
<target>_blank</target>
<title>省份</title>
<link></link>
<tree id=”p3-1″>
<text>杭州市</text>
<target>_blank</target>
<title>城市</title>
<link></link>
<node id=”p3-1-1″>
<text>某镇</text>
<target>_blank</target>
<title>乡镇</title>
<link>http://www.baidu.com/</link>
</node>
</tree>
<tree id=”p3-2″>
<text>温州市</text>
<target>_blank</target>
<title>城市</title>
<link></link>
<node id=”p3-2-1″>
<text>某镇</text>
<target>_blank</target>
<title>乡镇</title>
<link>http://www.baidu.com/</link>
</node>
</tree>
</tree>
</treeview>
<?xml version=”1.0″ encoding=”gb2312″?>
<treeview>
<tree id=”p1″>
<text>山东省</text>
<target>_blank</target>
<title>省份</title>
<link></link>
<tree id=”p1-1″>
<text>威海市</text>
<target>_blank</target>
<title>城市</title>
<link></link>
</tree>
<tree id=”p1-2″>
<text>烟台市</text>
<target>_blank</target>
<title>城市</title>
<link></link>
<node id=”p1-2-1″>
<text>长夼村</text>
<target>_blank</target>
<title>乡镇</title>
<link>http://www.baidu.com/</link>
</node>
</tree>
<node id=”p1-3″>
<text>富镇</text>
<target>_blank</target>
<title>乡镇</title>
<link>http://www.baidu.com/</link>
</node>
</tree><tree id=”p2″>
<text>河北省</text>
<target>_blank</target>
<title>省份</title>
<link></link>
<tree id=”p2-1″>
<text>泊头市</text>
<target>_blank</target>
<title>城市</title>
<link></link>
<node id=”p2-1-1″>
<text>郊河</text>
<target>_blank</target>
<title>乡镇</title>
<link>http://www.baidu.com/</link>
</node>
</tree>
<tree id=”p2-2″>
<text>石家庄</text>
<target>_blank</target>
<title>城市</title>
<link></link>
</tree>
</tree><tree id=”p3″>
<text>浙江省</text>
<target>_blank</target>
<title>省份</title>
<link></link>
<tree id=”p3-1″>
<text>杭州市</text>
<target>_blank</target>
<title>城市</title>
<link></link>
<node id=”p3-1-1″>
<text>某镇</text>
<target>_blank</target>
<title>乡镇</title>
<link>http://www.baidu.com/</link>
</node>
</tree>
<tree id=”p3-2″>
<text>温州市</text>
<target>_blank</target>
<title>城市</title>
<link></link>
<node id=”p3-2-1″>
<text>某镇</text>
<target>_blank</target>
<title>乡镇</title>
<link>http://www.baidu.com/</link>
</node>
</tree>
</tree>
</treeview>
然后：javascript函数实现：(文件名称：tree.htm）
Java代码
<script Language=”JavaScript”>
var HTML = “”;
var space = “”;
var blank = ” “;
function getSubject()
{
var xmlDoc;
if(window.ActiveXObject)
{
//获得操作的xml文件的对象
xmlDoc = new ActiveXObject(‘Microsoft.XMLDOM’);
xmlDoc.async = false;
xmlDoc.load(“tree.xml”);
if(xmlDoc == null)
{
alert(‘您的浏览器不支持xml文件读取,于是本页面禁止您的操作,推荐使用IE5.0以上可以解决此问题!’);
window.location.href=’/Index.aspx’;
return;
}
}
//解析xml文件，判断是否出错
if(xmlDoc.parseError.errorCode != 0)
{
alert(xmlDoc.parseError.reason);
return;
}
//获得根接点
var nodes = xmlDoc.documentElement.childNodes;
//得到根接点下共有子接点个数，并循环
for(var i=0; i<nodes.length; i++)
{
//如果接点名为 tree
if(nodes(i).nodeName == “tree”)
{
readTree(nodes(i));
}
//如果接点名为 node
else if(nodes(i).nodeName == “node”)
{
readNode(nodes(i));
}
}
//删除对象
delete(xmlDoc);
//显示HTML
window.show.innerHTML = HTML;
return;
}
//读Tree节点
function readTree(cI)
{
var nodes = cI.childNodes;
var menuHTML = space;
menuHTML += blank;
//得到超级链接
menuHTML += “<a href='”;
//如果该节点的连接属性不为空，则连接
if(cI.selectNodes(“link”)(0).text != “”)
{
menuHTML += cI.selectNodes(“link”)(0).text;
}
//否则为空链接
else
{
menuHTML += “#”;
}
//目标
if(cI.selectNodes(“target”)(0).text != “”)
{
menuHTML += ” target='”+cI.selectNodes(“target”)(0).text;
menuHTML += “‘”;
}
//点击菜单事件，调用divshow(vid)函数
menuHTML += ” onclick=javascript:divshow(‘”+cI.getAttribute(“id”)+”‘);”;
//得到节点标题
menuHTML += ” title='”;
menuHTML += cI.selectNodes(“title”)(0).text;
//结束
menuHTML += “‘>”;
//得到节点的正文
menuHTML += cI.selectNodes(“text”)(0).text;
menuHTML += “</a><br>\n”;
//将menuHTML设置添加到HTML字符串
HTML += menuHTML;
//得到该节点的属性值<span
HTML += “<div id='”+cI.getAttribute(“id”)+”‘ style=’display:none’>\n”;
for(var i=0; i<nodes.length; i++)
{
var tempImg = “”;
tempImg += blank;
if(nodes(i).nodeName == “tree”)
{
space += tempImg;
readTree(nodes(i));
space = “”;
}
else if(nodes(i).nodeName == “node”)
{
space += tempImg;
readNode(nodes(i));
}
}
HTML += “</div>\n”;
return;
}
//读Node节点
function readNode(cI)
{
var nodeHTML = space;
nodeHTML += blank;
//设置超级链接
nodeHTML += “<a href='”;
//得到连接地址
nodeHTML += cI.selectNodes(“link”)(0).text;
//目标
if(cI.selectNodes(“target”)(0).text != “”)
nodeHTML += “‘ target='”+cI.selectNodes(“target”)(0).text;
//得到节点标题
nodeHTML += “‘ title='”;
nodeHTML += cI.selectNodes(“title”)(0).text;
//结束
nodeHTML += “‘>”;
//得到节点的正文
nodeHTML += cI.selectNodes(“text”)(0).text;
nodeHTML += “</a><br>\n”;
HTML += nodeHTML;
//HTML += “<div id='”+cI.getAttribute(“id”)+”‘>”;
space = “”;
return;
}
//操作对象的显示还是隐藏效果
function divshow(vid)
{
if(document.all[vid].style.display == “none”)
{
document.all[vid].style.display = “block”;
}
else
{
document.all[vid].style.display = “none”;
}
return;
}
</script>
Html代码
<html>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″>
<title>JS_XML</title>
<style type=”text/css”>
<!–
body
{
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
font-size: 9pt;
}
A
{
text-decoration:none;
font-family: “宋体”;
font-size: 9pt;
COLOR:#000000;
}
–>
</style>
</head>
<body bgcolor=”#EEEEEE” leftmargin=”0″ topmargin=”0″>
<div id=show></div>
</body>
<script>
getSubject()
</script>
</html>
js常用方法
代码:
function strlen(str)
{
var i;
var len;
len = 0;
for (i=0;i<>
{
if (str.charCodeAt(i)>255) len+=2; else len++;
}
return len;
}
/*
* 判断是否为数字，是则返回true,否则返回false
*/代码
function f_check_number(obj)
{
if (/^\d+$/.test(obj.value))
{
return true;
}
else
{
f_alert(obj,”请输入数字”);
return false;
}
}
/*
* 判断是否为自然数，是则返回true,否则返回false
*/代码
function f_check_naturalnumber(obj)
{
var s = obj.value;
if (/^[0-9]+$/.test( s ) && (s > 0))
{
return true;
}
else
{
f_alert(obj,”请输入自然数”);
return false;
}
}
/*
* 判断是否为整数，是则返回true,否则返回false
*/代码
function f_check_integer(obj)
{
if (/^(\+|-)?\d+$/.test( obj.value ))
{
return true;
}
else
{
f_alert(obj,”请输入整数”);
return false;
}
}
/*
* 判断是否为实数，是则返回true,否则返回false
*/代码
function f_check_float(obj)
{
if (/^(\+|-)?\d+($|\.\d+$)/.test( obj.value ))
{
return true;
}
else
{
f_alert(obj,”请输入实数”);
return false;
}
}
/*
用途：检查输入字符串是否只由汉字组成
如果通过验证返回true,否则返回false
*/代码
function f_check_zh(obj){
if (/^[\u4e00-\u9fa5]+$/.test(obj.value)) {
return true;
}
f_alert(obj,”请输入汉字”);
return false;
}
/*
* 判断是否为小写英文字母，是则返回true,否则返回false
*/代码
function f_check_lowercase(obj)
{
if (/^[a-z]+$/.test( obj.value ))
{
return true;
}
f_alert(obj,”请输入小写英文字母”);
return false;
}
/*
* 判断是否为大写英文字母，是则返回true,否则返回false
*/代码
function f_check_uppercase(obj)
{
if (/^[A-Z]+$/.test( obj.value ))
{
return true;
}
f_alert(obj,”请输入大写英文字母”);
return false;
}
/*
* 判断是否为英文字母，是则返回true,否则返回false
*/代码
function f_check_letter(obj)
{
if (/^[A-Za-z]+$/.test( obj.value ))
{
return true;
}
f_alert(obj,”请输入英文字母”);
return false;
}
/*
用途：检查输入字符串是否只由汉字、字母、数字组成
输入：
value：字符串
返回：
如果通过验证返回true,否则返回false
*/代码
function f_check_ZhOrNumOrLett(obj){ //判断是否是汉字、字母、数字组成
var regu = “^[0-9a-zA-Z\u4e00-\u9fa5]+$”;
var re = new RegExp(regu);
if (re.test( obj.value )) {
return true;
}
f_alert(obj,”请输入汉字、字母或数字”);
return false;
}
/*
用途：校验ip地址的格式
输入：strIP：ip地址
返回：如果通过验证返回true,否则返回false；
*/代码
function f_check_IP(obj)
{
var re=/^(\d+)\.(\d+)\.(\d+)\.(\d+)$/; //匹配IP地址的正则表达式
if(re.test( obj.value ))
{
if( RegExp.$1 <256 && RegExp.$2<256 && RegExp.$3<256 && RegExp.$4<256) return true;
}
f_alert(obj,”请输入合法的计算机IP地址”);
return false;
}
/*
用途：检查输入对象的值是否符合端口号格式
输入：str 输入的字符串
返回：如果通过验证返回true,否则返回false
*/代码
function f_check_port(obj)
{
if(!f_check_number(obj))
return false;
if(obj.value < 65536)
return true;
f_alert(obj,”请输入合法的计算机IP地址端口号”);
return false;
}
/*
用途：检查输入对象的值是否符合网址格式
输入：str 输入的字符串
返回：如果通过验证返回true,否则返回false
*/代码
function f_check_URL(obj){
var myReg = /^((http:[/][/])?\w+([.]\w+|[/]\w*)*)?$/;
if(myReg.test( obj.value )) return true;
f_alert(obj,”请输入合法的网页地址”);
return false;
}
/*
用途：检查输入对象的值是否符合E-Mail格式
输入：str 输入的字符串
返回：如果通过验证返回true,否则返回false
*/代码
function f_check_email(obj){
var myReg = /^([-_A-Za-z0-9\.]+)@([_A-Za-z0-9]+\.)+[A-Za-z0-9]{2,3}$/;
if(myReg.test( obj.value )) return true;
f_alert(obj,”请输入合法的电子邮件地址”);
return false;
}
/*
要求：一、移动电话号码为11或12位，如果为12位,那么第一位为0
二、11位移动电话号码的第一位和第二位为”13″
三、12位移动电话号码的第二位和第三位为”13″
用途：检查输入手机号码是否正确
输入：
s：字符串
返回：
如果通过验证返回true,否则返回false
*/代码
function f_check_mobile(obj){
var regu =/(^[1][3][0-9]{9}$)|(^0[1][3][0-9]{9}$)/;
var re = new RegExp(regu);
if (re.test( obj.value )) {
return true;
}
f_alert(obj,”请输入正确的手机号码”);
return false;
}
/*
要求：一、电话号码由数字、”(“、”)”和”-“构成
二、电话号码为3到8位
三、如果电话号码中包含有区号，那么区号为三位或四位
四、区号用”(“、”)”或”-“和其他部分隔开
用途：检查输入的电话号码格式是否正确
输入：
strPhone：字符串
返回：
如果通过验证返回true,否则返回false
*/代码
function f_check_phone(obj)
{
var regu =/(^([0][1-9]{2,3}[-])?\d{3,8}(-\d{1,6})?$)|(^\([0][1-9]{2,3}\)\d{3,8}(\(\d{1,6}\))?$)|(^\d{3,8}$)/;
var re = new RegExp(regu);
if (re.test( obj.value )) {
return true;
}
f_alert(obj,”请输入正确的电话号码”);
return false;
}
/* 判断是否为邮政编码 */
代码
function f_check_zipcode(obj)
{
if(!f_check_number(obj))
return false;
if(obj.value.length!=6)
{
f_alert(obj,”邮政编码长度必须是6位”);
return false;
}
return true;
}
/*
用户ID，可以为数字、字母、下划线的组合，
第一个字符不能为数字,且总长度不能超过20。
*/代码
function f_check_userID(obj)
{
var userID = obj.value;
if(userID.length > 20)
{
f_alert(obj,”ID长度不能大于20″);
return false;
}
if(!isNaN(userID.charAt(0)))
{
f_alert(obj,”ID第一个字符不能为数字”);
return false;
}
if(!/^\w{1,20}$/.test(userID))
{
f_alert(obj,”ID只能由数字、字母、下划线组合而成”);
return false;
}
return true;
}
/*
功能：验证身份证号码是否有效
提示信息：未输入或输入身份证号不正确！
使用：f_check_IDno(obj)
返回：bool
*/代码
function f_check_IDno(obj)
{
var aCity={11:”北京”,12:”天津”,13:”河北”,14:”山西”,15:”内蒙古”,21:”辽宁”,22:”吉林”,23:”黑龙江”,31:”上海”,32:”江苏”,33:”浙江”,34:”安徽”,35:”福建”,36:”江西”,37:”山东”,41:”河南”,42:”湖北”,43:”湖南”,44:”广东”,45:”广西”,46:”海南”,50:”重庆”,51:”四川”,52:”贵州”,53:”云南”,54:”西藏”,61:”陕西”,62:”甘肃”,63:”青海”,64:”宁夏”,65:”新疆”,71:”台湾”,81:”香港”,82:”澳门”,91:”国外”};
var iSum = 0;
var info = “”;
var strIDno = obj.value;
var idCardLength = strIDno.length;
if(!/^\d{17}(\d|x)$/i.test(strIDno)&&!/^\d{15}$/i.test(strIDno))
{
f_alert(obj,”非法身份证号”);
return false;
}
//在后面的运算中x相当于数字10,所以转换成a
strIDno = strIDno.replace(/x$/i,”a”);
if(aCity[parseInt(strIDno.substr(0,2))]==null)
{
f_alert(obj,”非法地区”);
return false;
}
if (idCardLength==18)
{
sBirthday=strIDno.substr(6,4)+”-“+Number(strIDno.substr(10,2))+”-“+Number(strIDno.substr(12,2));
var d = new Date(sBirthday.replace(/-/g,”/”))
if(sBirthday!=(d.getFullYear()+”-“+ (d.getMonth()+1) + “-” + d.getDate()))
{
f_alert(obj,”非法生日”);
return false;
}
for(var i = 17;i>=0;i –)
iSum += (Math.pow(2,i) % 11) * parseInt(strIDno.charAt(17 – i),11);
if(iSum%11!=1)
{
f_alert(obj,”非法身份证号”);
return false;
}
}
else if (idCardLength==15)
{
sBirthday = “19” + strIDno.substr(6,2) + “-” + Number(strIDno.substr(8,2)) + “-” + Number(strIDno.substr(10,2));
var d = new Date(sBirthday.replace(/-/g,”/”))
var dd = d.getFullYear().toString() + “-” + (d.getMonth()+1) + “-” + d.getDate();
if(sBirthday != dd)
{
f_alert(obj,”非法生日”);
return false;
}
}
return true;
}
/*
功能：判断是否为日期(格式:yyyy年MM月dd日,yyyy-MM-dd,yyyy/MM/dd,yyyyMMdd)
提示信息：未输入或输入的日期格式错误！
使用：f_check_date(obj)
返回：bool
*/代码
function f_check_date(obj)
{
var date = Trim(obj.value);
var dtype = obj.eos_datatype;
var format = dtype.substring(dtype.indexOf(“(“)+1,dtype.indexOf(“)”)); //日期格式
var year,month,day,datePat,matchArray;
if(/^(y{4})(-|\/)(M{1,2})\2(d{1,2})$/.test(format))
datePat = /^(\d{4})(-|\/)(\d{1,2})\2(\d{1,2})$/;
else if(/^(y{4})(年)(M{1,2})(月)(d{1,2})(日)$/.test(format))
datePat = /^(\d{4})年(\d{1,2})月(\d{1,2})日$/;
else if(format==”yyyyMMdd”)
datePat = /^(\d{4})(\d{2})(\d{2})$/;
else
{
f_alert(obj,”日期格式不对”);
return false;
}
matchArray = date.match(datePat);
if(matchArray == null)
{
f_alert(obj,”日期长度不对,或日期中有非数字符号”);
return false;
}
if(/^(y{4})(-|\/)(M{1,2})\2(d{1,2})$/.test(format))
{
year = matchArray[1];
month = matchArray[3];
day = matchArray[4];
} else
{
year = matchArray[1];
month = matchArray[2];
day = matchArray[3];
}
if (month < 1 || month > 12)
{
f_alert(obj,”月份应该为1到12的整数”);
return false;
}
if (day < 1 || day > 31)
{
f_alert(obj,”每个月的天数应该为1到31的整数”);
return false;
}
if ((month==4 || month==6 || month==9 || month==11) && day==31)
{
f_alert(obj,”该月不存在31号”);
return false;
}
if (month==2)
{
var isleap=(year % 4==0 && (year % 100 !=0 || year % 400==0));
if (day>29)
{
f_alert(obj,”2月最多有29天”);
return false;
}
if ((day==29) && (!isleap))
{
f_alert(obj,”闰年2月才有29天”);
return false;
}
}
return true;
}
/*
功能：校验的格式为yyyy年MM月dd日HH时mm分ss秒,yyyy-MM-dd HH:mm:ss,yyyy/MM/dd HH:mm:ss,yyyyMMddHHmmss
提示信息：未输入或输入的时间格式错误
使用：f_check_time(obj)
返回：bool
*/代码
function f_check_time(obj)
{
var time = Trim(obj.value);
var dtype = obj.eos_datatype;
var format = dtype.substring(dtype.indexOf(“(“)+1,dtype.indexOf(“)”)); //日期格式
var datePat,matchArray,year,month,day,hour,minute,second;
if(/^(y{4})(-|\/)(M{1,2})\2(d{1,2}) (HH:mm:ss)$/.test(format))
datePat = /^(\d{4})(-|\/)(\d{1,2})\2(\d{1,2}) (\d{1,2}):(\d{1,2}):(\d{1,2})$/;
else if(/^(y{4})(年)(M{1,2})(月)(d{1,2})(日)(HH时mm分ss秒)$/.test(format))
datePat = /^(\d{4})年(\d{1,2})月(\d{1,2})日(\d{1,2})时(\d{1,2})分(\d{1,2})秒$/;
else if(format == “yyyyMMddHHmmss”)
datePat = /^(\d{4})(\d{2})(\d{2})(\d{2})(\d{2})(\d{2})$/;
else
{
f_alert(obj,”日期格式不对”);
return false;
}
matchArray = time.match(datePat);
if(matchArray == null)
{
f_alert(obj,”日期长度不对,或日期中有非数字符号”);
return false;
}
if(/^(y{4})(-|\/)(M{1,2})\2(d{1,2}) (HH:mm:ss)$/.test(format))
{
year = matchArray[1];
month = matchArray[3];
day = matchArray[4];
hour = matchArray[5];
minute = matchArray[6];
second = matchArray[7];
} else
{
year = matchArray[1];
month = matchArray[2];
day = matchArray[3];
hour = matchArray[4];
minute = matchArray[5];
second = matchArray[6];
}
if (month < 1 || month > 12)
{
f_alert(obj,”月份应该为1到12的整数”);
return false;
}
if (day < 1 || day > 31)
{
f_alert(obj,”每个月的天数应该为1到31的整数”);
return false;
}
if ((month==4 || month==6 || month==9 || month==11) && day==31)
{
f_alert(obj,”该月不存在31号”);
return false;
}
if (month==2)
{
var isleap=(year % 4==0 && (year % 100 !=0 || year % 400==0));
if (day>29)
{
f_alert(obj,”2月最多有29天”);
return false;
}
if ((day==29) && (!isleap))
{
f_alert(obj,”闰年2月才有29天”);
return false;
}
}
if(hour<0 || hour>23)
{
f_alert(obj,”小时应该是0到23的整数”);
return false;
}
if(minute<0 || minute>59)
{
f_alert(obj,”分应该是0到59的整数”);
return false;
}
if(second<0 || second>59)
{
f_alert(obj,”秒应该是0到59的整数”);
return false;
}
return true;
}
/*判断当前对象是否可见*/
代码
function isVisible(obj){
var visAtt,disAtt;
try{
disAtt=obj.style.display;
visAtt=obj.style.visibility;
}catch(e){}
if(disAtt==”none” || visAtt==”hidden”)
return false;
return true;
}
/*判断当前对象及其父对象是否可见*/
代码
function checkPrVis(obj){
var pr=obj.parentNode;
do{
if(pr == undefined || pr == “undefined”) return true;
else{
if(!isVisible(pr)) return false;
}
}while(pr=pr.parentNode);
return true;
}
/* 弹出警告对话框，用户点确定后将光标置于出错文本框上， 并且将原来输入内容选中。*/
代码
function f_alert(obj,alertInfo)
{
var caption = obj.getAttribute(“eos_displayname”);
if(caption == null)
caption = “”;
alert(caption + “：” + alertInfo + “！”);
obj.select();
if(isVisible(obj) && checkPrVis(obj))
obj.focus();
}
/**
* 检测字符串是否为空
*/代码
function isNullOrEmpty(str)
{
str = Trim(str);
if(str.length == 0) {
return true;
}
else {
return false
}
}
//去左空格
function LTrim(str){
return str.replace(/^\s*/g,””);
}
//去右空格
function RTrim(str){
return str.replace(/\s*$/g,””);
}//去首尾空格
function Trim(str){
return str.replace(/^\s*|\s*$/g,””);
}//get parameter value from ‘get’ url, strurl: window.parent.location.href or window.location.href, para: keyName
function getPara(para, strurl){
if (strurl.indexOf(“?”) == -1) {
//Do nothing.
return null;
}
else {
//get the string after ‘?’
var urlQuery = strurl.split(“?”);
if(urlQuery[1].indexOf(“&”)==-1){//only one parameter
if (urlQuery[1].indexOf(“=”) == -1) {
//no parameter value
//Do nothing
return null;
}
else{
var keyValue = urlQuery[1].split(“=”);
var key = keyValue[0];
var value = keyValue[1];
if(key==para){
return value;
}
}
}
else{
// analyse parameters
var urlTerms = urlQuery[1].split(“&”);
for (var i = 0; i < urlTerms.length; i++){
var keyValue = urlTerms[i].split(“=”);
var key = keyValue[0];
var value = keyValue[1];
if(key==para){
return value;
}
}
}
}
return null;
}// 功能: 1)去除字符串前后所有空格
// 2)去除字符串中所有空格(包括中间空格,需要设置第2个参数为:g)
function Trim(str,is_global)
{
var result;
result = str.replace(/(^\s+)|(\s+$)/g,””);
if(is_global.toLowerCase()==”g”)
result = result.replace(/\s/g,””);
return result;
}
遍历json
<script language=”javascript”>
function e()
{
var json=[{“kl_id”:”2″,”kl_title”:”Test date”,”kl_content”:”Test date”,”kl_type”:”1″,”id”:”1″},{“kl_id”:”2″,”kl_title”:”Test”,”kl_content”:”Test”,”kl_type”:”1″,”id”:”2″}]
var str = “”;
for (var one in json)
{
for(var key in json[one])
{
str += json[one][key]+ “,”;
}
}
document.form.txtName.value = str;
}
</script>
javascript:void(0)
JavaScript中void是一个操作符，该操作符指定要计算一个表达式但是不返回值。
void 操作符用法格式如下：
1. javascript:void (expression)
2. javascript:void expression
expression 是一个要计算的 JavaScript 标准的表达式。表达式外侧的圆括号是可选的，但是写上去是一个好习惯。 (实现版本 Navigator 3.0 )
你可以使用 void 操作符指定超级链接。表达式会被计算但是不会在当前文档处装入任何内容。
下面的代码创建了一个超级链接，当用户点击以后不会发生任何事。当用户点击链接时，void(0) 计算为 0，但在 JavaScript 上没有任何效果。
<A HREF=”javascript:void(0)”>单击此处什么也不会发生</A>
下面的代码创建了一个超级链接，用户单击时会提交表单。
<A HREF=”javascript:void(document.form.submit())”>单击此处提交表单</A>
那什么情况下用void(0)比较多呢，无刷新，当然是Ajax了，看一下Ajax的web页面的话，一般都会看到有很多的void(0)，所以在使用void(0)之前，最好先想一想这个页面是否需要整体刷新。
—————————————————————————-
使用javascript的时候，通常我们会通过类似：<a href=”#” onclick=”javascript:方法”>提交</a> 的方式，通过一个伪链接来调用javascript方法。这种方法有一个问题是：虽然点击该链接的时候不会跳转页面，但是滚动条会往上滚，解决的办法是返 回一个false。
如下所示：
<a href=”#” onclick=”javascript:方法;return false;”>提交</a><a href=”javascript:void(0)” onclick=”javascript:方法;return false;”>提交</a>
还有一个方法是 #this
a href=”#this” onclick=”javascript:方法”
—————————————————————————-
＃包含了一个位置信息
默认的锚点是＃top 也就是网页的上端
而javascript:void(0) 仅仅表示一个死链接
这就是为什么有的时候页面很长浏览链接明明是＃可是跳动到了页首
而javascript:void(0) 则不是如此
所以调用脚本的时候最好用void(0) 或者<input onclick> <div onclick>等
打开新窗口链接的几种办法
1.window.open(‘url’)
2.用自定义函数
<script>
function openWin(tag,obj)
{
obj.target=”_blank”;
obj.href = “Web/Substation/Substation.aspx?stationno=”+tag;
obj.click();
}
</script><a href=”javascript:void(0)” onclick=”openWin(3,this)”>株洲</a>
3.window.location.href=””
总结：1）链接（href）直接使用javascript:void(0)在IE中可能会引起一些问题，比如：造成gif动画停止播放 等，所以，最安全的办法还是使用“#”。为防止点击链接后跳转到页首，onclick事件return false即可。2）在使用void(0)之前,最好先想一想，这个页面是否需要整体刷新，不需要整体刷新时可以用void(0)。
innerHTML 和 pasteHTML 区别
innerHTML 是一个属性 ，可以取得或者设定该元素内的 HTML 内容，可以是任意能包含 HTML 子节点的元素都使用它
pasteHTML() 是一个方法 ，在指定的文字区域内替换该区域内的文本或者HTML，该方法必须应用于一个 createTextRange() 或者 document.selection.createRange() 创建的区域上
例：
<Script Language=”JavaScript”>
function addLink(){
var oRange = document.selection.createRange();
if(oRange.text!=”){
var oUrl = window.prompt(‘链接网址…’,’https://www.nopost.cn/’);
var oHtml = ‘<a href=’+oUrl+’ target=_blank>’+oRange.text+'</a>’;
oRange.pasteHTML(oHtml);
}else{
window.alert(‘您没有选择加链接的文字！’);
}