当前位置: 代码迷 >> Web前端 >> 转:web开发惯用js收藏二
  详细解决方案

转:web开发惯用js收藏二

热度:318   发布时间:2012-08-28 12:37:01.0
转:web开发常用js收藏二
106.动态改变类型
<style>
.Overnone { border-width:0;background-color:darkblue;cursor:default;color:gold;width:115}
.Outnone   {border-width:0;background-color:white;cursor:default;width:115}
</style>
<input class=Outnone onmouseover=this.className='Overnone' >//

107.页面翻转
<html dir=rtl></html>//

108.滚屏
parent.scroll(x,y);//
<body onload="s=0" onDblClick="s=setInterval('scrollBy(0, 1)',10)" onClick="clearInterval(s)">//

109.改变状态栏
self.status ="";//

110.改变窗口大小
window.resizeTo(200,300);//

111.改变鼠标样式
style
BODY{CURSOR: url('mouse.ani');
SCROLLBAR-BASE-COLOR: #506AA8;
SCROLLBAR-ARROW-COLOR: #14213F;
}//

112.背景透明
<input type="button" value="Button" style="background-color: transparent; border: 0;">//

113.鼠标为等待形状
<input type=button onclick="this.style.cursor='wait'">//

114.调用父窗口的函数
opener.fucntion1();//

115.body的内部html代码
<input type="button" onclick="alert(code.document.body.innerHTML)" value="查看">//

116.框架中调用父窗口的函数
<INPUT TYPE='button' onclick='parent.test();' value='调用parent窗口的函数'>//

117.交换节点
<table  width=200  height=200  border>
<tr><td  id=c1>CELL_1</td></tr>
<tr><td  id=c2>CELL_2</td></tr>
</table>
<br>
<input  type="button"  value="swap  row"  onclick="c1.swapNode(c2)">//

118.删除节点
<table  width=200  height=200  border>
<tr id=trall><td  id=c1>CELL_1</td></tr>
<tr><td  id=c2>CELL_2</td></tr>
</table>
<br>
<input  type="button"  value="swap  row"  onclick="trall.removeNode(c2)">//

119.添加节点
addNode()//

120.获得事件的父与子标签
event.srcElement.children[0]和event.srcElement.parentElement //

 
121.集中为按钮改变颜色
<style>
button{benc:expression(this.onfocus = function(){this.style.backgroundColor='#E5F0FF';})}
</style>
<button>New</button>//


122.判断是左键还是右键被按下
<body onmousedown=if(event.button==1)alert("左键");if(event.button==2)alert("右键")>//

123.获得操作系统的名称和浏览器的名称
document.write(navigator.userAgent)//

 
124.alt/ctrl/shift键按下
event.altKey //按下alt键
event.ctrlKey //按下ctrl键
event.shiftKey //按下shift键

 

125.将当前位置定位为C盘。
{window.location="c:"}//

126.返回输入框的类型
<script>
alert(event.srcElement.type);//
</script>

127.模拟控件的单击事件
<INPUT TYPE="hidden" name="guoguo" onclick="haha()">
<SCRIPT LANGUAGE="JavaScript">
<!--

function haha()
{
 alert();
}
guoguo.click();
//-->
</SCRIPT>//

 
128.取出记录集的列名
java.sql.ResultSet rset = com.bsitc.util.DBAssist.getIT().executeQuery(queryStatement, conn);
java.sql.ResultSetMetaData metaData = rset.getMetaData();
int count = metaData.getColumnCount();
String name = metaData.getColumnName(i);
String value = rset.getString(i);//

129.格式化数字
function format_number(str,digit)
{
 if(isNaN(str))
 {
  alert("您传入的值不是数字!");
  return 0;
 }
 else if(Math.round(digit)!=digit)
 {
  alert("您输入的小数位数不是整数!");
  return 0;
 }
 else
  return Math.round(parseFloat(str)*Math.pow(10,digit))/Math.pow(10,digit);
}

130.回车按钮转化为tab按钮
if(event.keyCode==13) event.keyCode=9; //将

 
131.滚动条滚动
<button onclick="text1.scrollTop=text1.scrollHeight">Scroll</button><br>
<textarea id="text1" cols=50 rows=10>
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
</textarea>//

 
132.判断是什么对象
if(typeof(unknown)=="function")return true;
if(typeof(unknown)!="object")return false;//

 
133.取消文本框自动完成功能
<input type="text" autocomplete="off"> //

134.让下拉框自动下拉
<select onmouseover="javascript:this.size=this.length" onmouseout="javascript:this.size=1">
<option value="">1</option>
<option value="">2</option>
<option value="">3</option>
</select> //

 
135.读取XML文件
var childrenobj=myselect//document.all.myselect;
    var oXMLDoc = new ActiveXObject('MSXML');
    oXMLDoc.url = "mymsg.xml";
    var oRoot=oXMLDoc.root;
    if(oRoot.children != null)
 {
        for(var i=0;i<oRoot.children.item(0).children.length;++i)
  {
            oItem = oRoot.children.item(0).children.item(i);
            oOption = new Option(oItem.text,oItem.value);
   childrenobj.add(oOption);
        }
    }
//mymsg.xml文件
<?xml version="1.0" encoding="gb2312" ?>
<childrenlist>
<aa>
<child value='3301'>杭州地区</child>

<child value='3303'>温州地区</child>

</aa>
<aa>
<child value='3310'>台州地区</child>

<child value='3311'>丽水地区</child>
</aa>
</childrenlist>//

 
136.点击图片,图片停止
<a href="javascript:"><img src="http://www.51js.com/images/51js/red_forum.gif" border="0"></a>//

137.显示本地计算机信息
var WshNetwork = new ActiveXObject("WScript.Network");
alert("Domain = " + WshNetwork.UserDomain);
alert("Computer Name = " + WshNetwork.ComputerName);
alert("User Name = " + WshNetwork.UserName);//

 
138.比较时间
  tDate = new Date(2004,01,08,14,35); //年,月,日,时,分
  dDate = new Date();
  tDate<dDate?alert("早于"):alert("晚于");//

139.弹出鼠标所在处的链结地址
  <body onmouseover="if (event.srcElement.tagName=='A')alert(event.srcElement.href)"><a

href="http://51js.com/viewthread.php?tid=13589" >dddd</a><input>//

140.注意不能通过与 undefined 做比较来测试一个变量是否存在,虽然可以检查它的类型是否为“undefined”。在以

下的代码范例中,假设程序员想测试是否已经声明变量 x :
// 这种方法不起作用
if (x == undefined)
    // 作某些操作
// 这个方法同样不起作用- 必须检查


// 字符串 "undefined"
if (typeof(x) == undefined)
    // 作某些操作
// 这个方法有效
if (typeof(x) == "undefined")
    // 作某些操作

141.创建具有某些属性的对象
var myObject = new Object();
myObject.name = "James";
myObject.age = "22";
myObject.phone = "555 1234";//

142.枚举(循环)对象的所有属性
for (var a in myObject)
{
    // 显示 "The property 'name' is James",等等。
    window.alert("The property '" + a + "' is " + myObject[a]);
}//

143.判断一个数字是否是整数
var a=23.2;
alert(a%1==1)//


144.新建日期型变量
var a = new Date(2000, 1, 1);
alert(a.toLocaleDateString());


145.给类定义新的方法
function trim_1()
{
  return this.replace(/(^\s*)|(\s*$)/g, "");
}
String.prototype.trim=trim_1;
alert('cindy'.trim());

 
146.定义一个将日期类型转化为字符串的方法
function guoguo_date()
{
 var tmp1,tmp2;
 tmp1 =this.getMonth()+1+"";
 if(tmp1.length<2)
  tmp1="0"+tmp1;
 tmp2 =this.getDate()+"";
 if(tmp2.length<2)
  tmp2="0"+tmp2;
 
 return this.getYear()+"-"+tmp1+"-"+tmp2;
}
Date.prototype.toLiteString=guoguo_date;
alert(new Date().toLiteString())

 

147. pasta 是有四个参数的构造器,定义对象。
function pasta(grain, width, shape, hasEgg)
{
    // 是用什么粮食做的?
    this.grain = grain;

    // 多宽?(数值)
    this.width = width;    

    // 横截面形状?(字符串)
    this.shape = shape;  

    // 是否加蛋黄?(boolean)
    this.hasEgg = hasEgg; 

    //定义方法
    this.toString=aa;
}
function aa()
{
 ;
}
//定义了对象构造器后,用 new 运算符创建对象实例。
var spaghetti = new pasta("wheat", 0.2, "circle", true);
var linguine = new pasta("wheat", 0.3, "oval", true);
//补充定义属性,spaghetti和linguine都将自动获得新的属性
pasta.prototype.foodgroup = "carbohydrates";

 
148.打印出错误原因
try
{
 x = y   // 产生错误。
}
catch(e)
{
   document.write(e.description)   //打印 "'y' is undefined".
}//

149.生成EXCEL文件并保存
var ExcelSheet;
ExcelApp = new ActiveXObject("Excel.Application");
ExcelSheet = new ActiveXObject("Excel.Sheet");
//本代码启动创建对象的应用程序(在这种情况下,Microsoft Excel 工作表)。一旦对象被创建,就可以用定义的对

象变量在代码中引用它。 在下面的例子中,通过对象变量 ExcelSheet 访问新对象的属性和方法和其他 Excel 对象,

包括 Application 对象和 ActiveSheet.Cells 集合。
// 使 Excel 通过 Application 对象可见。
ExcelSheet.Application.Visible = true;
// 将一些文本放置到表格的第一格中。
ExcelSheet.ActiveSheet.Cells(1,1).Value = "This is column A, row 1";
// 保存表格。
ExcelSheet.SaveAs("C:\\TEST.XLS");
// 用 Application 对象用 Quit 方法关闭 Excel。
ExcelSheet.Application.Quit();//

150.根据标签获得一组对象
var coll = document.all.tags("DIV");
if (coll!=null)
{
for (i=0; i<coll.length; i++)
...
}//

151.实现打印预览及打印
<OBJECT classid="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2" height=0 id=wb name=wb width=0></OBJECT>
<input type=button value=打印预览 onclick="wb.execwb(7,1)">
<input type=button onClick=document.all.wb.ExecWB(6,1) value="打印">//

152.不通过form,直接通过名字引用对象
<INPUT TYPE="text" NAME="gg" value=aaaaa>
<SCRIPT LANGUAGE="JavaScript">
<!--
alert(document.all.gg.value)
//-->
</SCRIPT>//

153.使鼠标滚轮失效
function document.onmousewheel()
{
 return false;
}//
 
154.创建弹出窗口
<SCRIPT LANGUAGE="JScript">
  var oPopup = window.createPopup();
  var oPopupBody = oPopup.document.body;
  oPopupBody.innerHTML = "Display some <B>HTML</B> here.";
  oPopup.show(100, 100, 200, 50, document.body);
</SCRIPT>//

155.取得鼠标所在处的对象
var obj = document.elementFromPoint(event.x,event.y);//

156.获得左边的对象
<INPUT TYPE="text" NAME="gg"><INPUT TYPE="text" NAME="bb"

onclick="this.previousSibling.value='guoguo'">//

157.定位鼠标
document.all.hint_layer.style.left  = event.x+document.body.scrollLeft+10;
document.all.hint_layer.style.top  = event.y+document.body.scrollTop+10;//

158.向下拉框指定位置添加项目
var op  = document.createElement("OPTION");
document.all.selected_items.children(index).insertAdjacentElement("BeforeBegin",op);
op.text  = document.all.all_items[i].text;
op.value = document.all.all_items[i].value;//

 
159.判断一个窗口是否已经打开,如果已经打开,则关闭之
var a;
if(a)
 a.close();
else
 a=window.open('','','');//

160.动态创建一个标签
newElem  = document.createElement("DIV");
newElem.id = "hint_layer";
document.body.appendChild(newElem);
document.all.hint_layer.innerText="guoguo";//

161.标题栏
document.title//

162.背景图片
<body style="BACKGROUND-ATTACHMENT: fixed" background="img/bgfix.gif" ></body>//背景图片不动

<STYLE TYPE="text/css">
<!--
BODY {background-image:img/bgchild.jpg;
background-position: center;
background-repeat: no-repeat;
background-attachment: fixed;}
-->
</STYLE>//背景图片居中

163.设置透明效果
document.form.xxx.filters.alpha.opacity=0~100//

164.定义方法
var dragapproved=false;
document.onmouseup=new Function("dragapproved = false");//
 
165.将数字转化为人民币大写形式
function convertCurrency(currencyDigits) {
// Constants:
 var MAXIMUM_NUMBER = 99999999999.99;
 // Predefine the radix characters and currency symbols for output:
 var CN_ZERO = "零";
 var CN_ONE = "壹";
 var CN_TWO = "贰";
 var CN_THREE = "叁";
 var CN_FOUR = "肆";
 var CN_FIVE = "伍";
 var CN_SIX = "陆";
 var CN_SEVEN = "柒";
 var CN_EIGHT = "捌";
 var CN_NINE = "玖";
 var CN_TEN = "拾";
 var CN_HUNDRED = "佰";
 var CN_THOUSAND = "仟";
 var CN_TEN_THOUSAND = "万";
 var CN_HUNDRED_MILLION = "亿";
 var CN_SYMBOL = "人民币";
 var CN_DOLLAR = "元";
 var CN_TEN_CENT = "角";
 var CN_CENT = "分";
 var CN_INTEGER = "整";
 
// Variables:
 var integral; // Represent integral part of digit number.
 var decimal; // Represent decimal part of digit number.
 var outputCharacters; // The output result.
 var parts;
 var digits, radices, bigRadices, decimals;
 var zeroCount;
 var i, p, d;
 var quotient, modulus;
 
// Validate input string:
 currencyDigits = currencyDigits.toString();
 if (currencyDigits == "") {
  alert("Empty input!");
  return "";
 }
 if (currencyDigits.match(/[^,.\d]/) != null) {
  alert("Invalid characters in the input string!");
  return "";
 }
 if ((currencyDigits).match(/^((\d{1,3}(,\d{3})*(.((\d{3},)*\d{1,3}))?)|(\d+(.\d+)?))$/) == null) {
  alert("Illegal format of digit number!");
  return "";
 }
 
// Normalize the format of input digits:
 currencyDigits = currencyDigits.replace(/,/g, ""); // Remove comma delimiters.
 currencyDigits = currencyDigits.replace(/^0+/, ""); // Trim zeros at the beginning.
 // Assert the number is not greater than the maximum number.
 if (Number(currencyDigits) > MAXIMUM_NUMBER) {
  alert("Too large a number to convert!");
  return "";
 }
 
// Process the coversion from currency digits to characters:
 // Separate integral and decimal parts before processing coversion:
 parts = currencyDigits.split(".");
 if (parts.length > 1) {
  integral = parts[0];
  decimal = parts[1];
  // Cut down redundant decimal digits that are after the second.
  decimal = decimal.substr(0, 2);
 }
 else {
  integral = parts[0];
  decimal = "";
 }
 // Prepare the characters corresponding to the digits:
 digits = new Array(CN_ZERO, CN_ONE, CN_TWO, CN_THREE, CN_FOUR, CN_FIVE, CN_SIX, CN_SEVEN, CN_EIGHT,

CN_NINE);
 radices = new Array("", CN_TEN, CN_HUNDRED, CN_THOUSAND);
 bigRadices = new Array("", CN_TEN_THOUSAND, CN_HUNDRED_MILLION);
 decimals = new Array(CN_TEN_CENT, CN_CENT);
 // Start processing:
 outputCharacters = "";
 // Process integral part if it is larger than 0:
 if (Number(integral) > 0) {
  zeroCount = 0;
  for (i = 0; i < integral.length; i++) {
   p = integral.length - i - 1;
   d = integral.substr(i, 1);
   quotient = p / 4;
   modulus = p % 4;
   if (d == "0") {
    zeroCount++;
   }
   else {
    if (zeroCount > 0)
    {
     outputCharacters += digits[0];
    }
    zeroCount = 0;
    outputCharacters += digits[Number(d)] + radices[modulus];
   }
   if (modulus == 0 && zeroCount < 4) {
    outputCharacters += bigRadices[quotient];
   }
  }
  outputCharacters += CN_DOLLAR;
 }
 // Process decimal part if there is:
 if (decimal != "") {
  for (i = 0; i < decimal.length; i++) {
   d = decimal.substr(i, 1);
   if (d != "0") {
    outputCharacters += digits[Number(d)] + decimals[i];
   }
  }
 }
 // Confirm and return the final output string:
 if (outputCharacters == "") {
  outputCharacters = CN_ZERO + CN_DOLLAR;
 }
 if (decimal == "") {
  outputCharacters += CN_INTEGER;
 }
 outputCharacters = CN_SYMBOL + outputCharacters;
 return outputCharacters;
}//

 
166.xml数据岛绑定表格
<html>
<body>
<xml id="abc" src="test.xml"></xml>
<table border='1' datasrc='#abc'>
<thead>
<td>接收人</td>
<td>发送人</td>
<td>主题</td>
<td>内容</td>
</thead>
<tfoot>
<tr><th>表格的结束</th></tr>
</tfoot>
<tr>
<td><div datafld="to"></div></td>
<td><div datafld="from"></div></td>
<td><div datafld="subject"></div></td>
<td><div datafld="content"></div></td>
</tr>
</table>
</body>
</html>

//cd_catalog.xml
<?xml version="1.0" encoding="ISO-8859-1" ?>
 <!--  Edited with XML Spy v4.2
  -->
 <CATALOG>
 <CD>
  <TITLE>Empire Burlesque</TITLE>
  <ARTIST>Bob Dylan</ARTIST>
  <COUNTRY>USA</COUNTRY>
  <COMPANY>Columbia</COMPANY>
  <PRICE>10.90</PRICE>
  <YEAR>1985</YEAR>
  </CD>
 <CD>
  <TITLE>Hide your heart</TITLE>
  <ARTIST>Bonnie Tyler</ARTIST>
  <COUNTRY>UK</COUNTRY>
  <COMPANY>CBS Records</COMPANY>
  <PRICE>9.90</PRICE>
  <YEAR>1988</YEAR>
  </CD>
 <CD>
  <TITLE>Greatest Hits</TITLE>
  <ARTIST>Dolly Parton</ARTIST>
  <COUNTRY>USA</COUNTRY>
  <COMPANY>RCA</COMPANY>
  <PRICE>9.90</PRICE>
  <YEAR>1982</YEAR>
  </CD>
 <CD>
  <TITLE>Still got the blues</TITLE>
  <ARTIST>Gary Moore</ARTIST>
  <COUNTRY>UK</COUNTRY>
  <COMPANY>Virgin records</COMPANY>
  <PRICE>10.20</PRICE>
  <YEAR>1990</YEAR>
  </CD>
</CATALOG>
//


167.以下组合可以正确显示汉字
================================
xml保存编码 xml页面指定编码
ANSI  gbk/GBK、gb2312
Unicode  unicode/Unicode
UTF-8  UTF-8
================================

 
168.XML操作
<xml id="xmldata" src="/data/books.xml">
<div id="guoguo"></div>
<script>
var x=xmldata.recordset //取得数据岛中的记录集
if(x.absoluteposition < x.recordcount) //如果当前的绝对位置在最后一条记录之前
{
 x.movenext();     //向后移动
 x.moveprevious();    //向前移动
 x.absoluteposition=1;   //移动到第一条记录
 x.absoluteposition=x.recordcount;//移动到最后一条记录,注意记录集x.absoluteposition是从1到记录集记录的个

数的
 guoguo.innerText=xmldso.recordset("field_name"); //从中取出某条记录
}
</script>
  相关解决方案