`

javascript 技巧(一)

阅读更多

一. open 居中

 

function newWin(url){
	window.open(url, "newwindow", "width=600,height=500,top="+(screen.availHeight-500)/2+",left="+(screen.availWidth-600)/2+", toolbar=no, menubar=no, scrollbars=yes, resizable=no, location=no, status=no");
}

 

二. JavaScript 基础知识

 

        附件 JavaScript_Core_-_v0.pdf

 

 

三. JavaScript 刷新页面

Javascript刷新页面的几种方法:
1    history.go(0)
2    location.reload()
3    location=location
4    location.assign(location)
5    document.execCommand('Refresh')
6    window.navigate(location)
7    location.replace(location)
8    document.URL=location.href

自动刷新页面的方法:

1 .页面自动刷新:把如下代码加入<head>区域中

<meta http-equiv="refresh" content="20">

其中20指每隔20秒刷新一次页面.

2 .页面自动跳转:把如下代码加入<head>区域中

<meta http-equiv="refresh" content="20;url=http://www.wyxg.com">

其中20指隔20秒后跳转到http://www.wyxg.com页面

3 .页面自动刷新js版

<script language="JavaScript">
function myrefresh()
{
       window.location.reload();
}

setTimeout('myrefresh()',1000); //指定1秒刷新一次
</script>

 


JS刷新框架的脚本语句

//如何刷新包含该框架的页面用  

<script language=JavaScript>
   parent.location.reload();
</script> 

 

//子窗口刷新父窗口

<script language=JavaScript>
    self.opener.location.reload();
</script>

( 或 <a href="javascript:opener.location.reload()">刷新</a>   )

 


//如何刷新另一个框架的页面用  

<script language=JavaScript>
   parent.另一FrameID.location.reload();
</script>

 


//如果想关闭窗口时刷新或者想开窗时刷新的话,在<body>中调用以下语句即可。

<body onload="opener.location.reload()"> 开窗时刷新
<body onUnload="opener.location.reload()"> 关闭时刷新
<script language="javascript">
window.opener.document.location.reload()
</script>

 


//如果想在刷新时不弹出提示可以用:

window.location.href=window.location.href ;
window.location.reload;

 

但是window.location.href="要刷新的页面",在ie7中没有问题,在ie6和遨游中就不行,而window.location.reload()就可以,要多注意啦

 

<js基础>--javascript刷新页面

1.Response.Write("<script   language=javascript>parent.left.document.location.reload();</script>");
2.Response.Write("<script>window.top.location='login.aspx';window.close</script>");
3.this.RegisterStartupScript("reload","<script>window.parent.frames('left').location.reload(true);</script>");     或    this.RegisterStartupScript("reload","<script>window.parent.frames('left').location.href=window.parent.frames('left').location.href;</script>");

 

四. JavaScript  typeof()用法 

经常会在js里用到数组,比如 多个名字相同的input, 若是动态生成的, 提交时就需要判断其是否是数组.

if(document.mylist.length != "undefined" ) {} 这个用法有误.

正确的是 if( typeof(document.mylist.length) != "undefined" ) {}

或 if( !isNaN(document.mylist.length) ) {}

typeof的运算数未定义,返回的就是 "undefined".

运算数为数字 typeof(x) = "number"

字符串 typeof(x) = "string"

布尔值 typeof(x) = "boolean"

对象,数组和null typeof(x) = "object"

函数 typeof(x) = "function"

typeof 运算符返回一个用来表示表达式的数据类型的字符串。
可能的字符串有:"number"、"string"、"boolean"、"object"、"function" 和 "undefined"。
如:
alert(typeof (123));//typeof(123)返回"number"
alert(typeof ("123"));//typeof("123")返回"string"

typeof 运算符

返回一个用来表示表达式的数据类型的字符串。

typeof[()expression[]] ;

expression 参数是需要查找类型信息的任意表 达式。
说明

typeof 运算符把类型信息当作字符串返回。typeof 返回值有六种可能: "number," "string," "boolean," "object," "function," 和 "undefined."
typeof 语法中的圆括号是可选项。

 

 

五. JavaScript  js 中 html 对象删除

/**
   * @deprecated 关闭div 真正的从html中移除div代码,释放资源,兼容ie和火狐
   * 
   */
var divobj = creatElement("div");

   function closeDiv(divobj)
   {
    divobj.parentNode.removeChild(divobj);
   }

 

 

六. JavaScript  Event.observe

Event.observe('loginName', 'click', function (event) 用法

第一个参数是元素名。。。。。第二个参数是动作。。。。第三个参数是执行的函数。。。。

 

使用Event.observe可以更好地让页面元素与js代码分离,如下面的代码.

 

function init() {

Event.observe('loginName', 'click', function (event) {
   Event.element(event).select();
   $("loginName").value="";
});

var loginName = $("loginName") ;
loginName.style.color ="gray";

}

Event.observe(document, 'dom:loaded', init);

 

<html>  
<head>  
    <title>测试</title>  
    <script type="text/javascript" src="prototype-1.5.1.2.js"></script>  
</head>  
<body>  
请输入:<input type="text" name="birth" id="birth"/><br/>  
<input id="btn_test" type="button" value="测试" />  
</body>  
</html>  
<script type="text/javascript" language="javascript">  
                 Event.observe('btn_test', 'click', test);   
                 function test(){   
                     alert("弹出消息!!!");   
                 }   
</script>

 

 

七. JavaScript 判断 日期 时间 格式是否正确

function isDate(date) {
	if (typeof (date) == 'undefined' || date == null || date == '') {
		return false;
	}
	// 日期的分隔符
	var splitStr = '/';

	var strs = date.split(splitStr);

	var d = new Date(strs[0], strs[1] - 1, strs[2]);

	var year = d.getFullYear();
	var month = d.getMonth() + 1;
	var day = d.getDate();

	// 以十进制分割比较
	if (parseInt(strs[0], 10) == year && parseInt(strs[1], 10) == month
			&& parseInt(strs[2], 10) == day) {
		return true;
	} else {
		return false;
	}
}

 

 

八. JavaScript  计算日期加减

 某个日期 + 多少月多少天 = 某个日期的问题。至于,某个日期 - 某个日期 = 多少天

 

//解决IE下得到时间为NaN的情况
function parseISO8601(dateStringInRange) {
    var isoExp = /^s*(d{4})-(dd)-(dd)s*$/,
        date = new Date(NaN), month,
        parts = isoExp.exec(dateStringInRange);
    if(parts) {
      month = +parts[2];
      date.setFullYear(parts[1], month - 1, parts[3]);
      if(month != date.getMonth() + 1) {
        date.setTime(NaN);
      }
    }
    return date;
}
var change_date = function(dates,months,days) {
    var datestr = parseISO8601(dates);
    // 参数表示在当前日期下要增加的天数 
    var now = new Date(datestr);
    if(months != 0){
        now.setMonth(now.getMonth() + months);   
    }
    now.setDate((now.getDate()-1) + 1 * days);
    var year = now.getFullYear(); 
    if(months != 0){
        var month = now.getMonth()+1;
    }else{
        var month = now.getMonth()+1;
    }    
    var day = now.getDate(); 
    if (month < 10) { 
        month = '0' + month; 
    } 
    if (day < 10) { 
        day = '0' + day; 
    } 
    return year + '-' + month + '-' + day; 
}; 
var n = change_date("2012-12-01",12,32);
alert(n);

 

 

 javascript 中日期的加减运算.如今天 + 80天

 

function   DateAdd(interval,number,date)
{
/*
  *---------------   DateAdd(interval,number,date)   -----------------
  *   DateAdd(interval,number,date)  
  *   功能:实现VBScript的DateAdd功能.
  *   参数:interval,字符串表达式,表示要添加的时间间隔.
  *   参数:number,数值表达式,表示要添加的时间间隔的个数.
  *   参数:date,时间对象.
  *   返回:新的时间对象.
  *   var   now   =   new   Date();
  *   var   newDate   =   DateAdd( "d ",5,now);
  *   author:wanghr100(灰豆宝宝.net)
  *   update:2004-5-28   11:46
  *---------------   DateAdd(interval,number,date)   -----------------
  */
        switch(interval)
        {
                case   "y "   :   {
                        date.setFullYear(date.getFullYear()+number);
                        return   date;
                        break;
                }
                case   "q "   :   {
                        date.setMonth(date.getMonth()+number*3);
                        return   date;
                        break;
                }
                case   "m "   :   {
                        date.setMonth(date.getMonth()+number);
                        return   date;
                        break;
                }
                case   "w "   :   {
                        date.setDate(date.getDate()+number*7);
                        return   date;
                        break;
                }
                case   "d "   :   {
                        date.setDate(date.getDate()+number);
                        return   date;
                        break;
                }
                case   "h "   :   {
                        date.setHours(date.getHours()+number);
                        return   date;
                        break;
                }
                case   "m "   :   {
                        date.setMinutes(date.getMinutes()+number);
                        return   date;
                        break;
                }
                case   "s "   :   {
                        date.setSeconds(date.getSeconds()+number);
                        return   date;
                        break;
                }
                default   :   {
                        date.setDate(d.getDate()+number);
                        return   date;
                        break;
                }
        }
}

var   now   =   new   Date();
//加五天.
var   newDate   =   DateAdd( "d ",5,now);
alert(newDate.toLocaleDateString())
//加两个月.
newDate   =   DateAdd( "m ",2,now);
alert(newDate.toLocaleDateString())
//加一年
newDate   =   DateAdd( "y ",1,now);
alert(newDate.toLocaleDateString()) 

 

 

 

九. JavaScript  四舍五入 计算

 

<!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>Javascript四舍五入(Math.round()与Math.pow())</title>
    <script type="text/javascript">
        //Math.round(x);返回数字最接近的整数,四舍五入取整数,即舍去小数部分
        function f(){
            alert(Math.round(123.567));
            alert(Math.round(123.456));
        }
        //Math.pow(x,y);返回底数的指定次幂
        //返回以x的y次幂,等同于x的y次幂的数值表达式
        //如果pow的参数过大而引起浮点溢出,返回Infinity
        function f1(){
            alert(Math.pow(2,10));//2的10次方等于1024
            alert(Math.pow(1024,0.1));//1024的0.1次方等于2
            alert(Math.pow(99,9999));//溢出则返回Infinity
        }
        /*Javascript设置要保留的小数位数,四舍五入。
         *ForDight(Dight,How):数值格式化函数,Dight要格式化的 数字,How要保留的小数位数。
         *这里的方法是先乘以10的倍数,然后去掉小数,最后再除以10的倍数。
         */  
        function ForDight(Dight,How){  
            Dight = Math.round(Dight*Math.pow(10,How))/Math.pow(10,How);  
            return Dight;  
        }  
        function f2(){
            alert(ForDight(12345.67890,3));//保留三位小数
            alert(ForDight(123.99999,4));//保留四位小数
        }
        //另外一种四舍五入的方法,原理一样。
        //里面的两个参数:num就是要转换的数据。n为要转换的位数
        //cheng(123.456,2);//保留两位小数
        function cheng(num,n){
            var  dd=1;  
            var  tempnum;  
            for(i=0;i<n;i++){
                dd*=10;  
            }  
            tempnum = num*dd;
            tempnum = Math.round(tempnum);  
            alert(tempnum/dd);  
        }
    </script>
</head>
<body>
    <input type="button" value="round" onclick="f();" />
    <input type="button" value="pow" onclick="f1();" />
    <input type="button" value="设置要保留的小数位数,四舍五入" onclick="f2();" />
    <input type="button" value="cheng" onclick="cheng(123.456,2);" />
</body>
</html>

 

代码 



Code highlighting produced by Actipro CodeHighlighter (freeware)
http://www.CodeHighlighter.com/

--><script type="text/javascript">
//用Javascript取float型小数点后两位,例22.127456取成22.13,如何做? 
//1.最笨的办法....... [我就怎么干的.........] 
    function get(){
        var s = 22.127456 + "";
        var str = s.substring(0,s.indexOf(".") + 3);
        alert(str);
    } 
</script>
<script type="text/javascript">
//2. 正则表达式效果不错 
    onload = function(){
        var a = "23.456322";
        var aNew;
        var re = /([0-9]+\.[0-9]{2})[0-9]*/;
        aNew = a.replace(re,"$1");
        alert(aNew);
    }
</script>

<script type="text/javascript">
//3. 他就比较聪明了..... 
    var num=22.127456;
    alert( Math.round(num*100)/100);
</script> 

<script type="text/javascript">
//4.会用新鲜东西的朋友....... 但是需要 IE5.5+才支持。 
//计算有问题
    var num=22.127456;
    alert( num.toFixed(2));
</script>

 

 

 

 

 

 

 

 

 

 

 

 

 

分享到:
评论
发表评论

文章已被作者锁定,不允许评论。

相关推荐

    JavaScript小技巧全集 JavaScript教程 JavaScript源代码集

    JavaScript,作为全球最广泛使用的脚本语言之一,是构建网页动态功能和交互效果的基础。这个“JavaScript小技巧全集”提供了丰富的教程和源代码,旨在帮助开发者深入理解和掌握JavaScript的各种实用技巧。 首先,...

    javascript技巧(javascript调用C#方法)个人学习笔记

    javascript技巧(javascript调用C#方法) 个人笔记

    javascript技巧精心收集

    "javascript技巧精心收集"这个主题包含了一系列关于JavaScript编程的实用技巧和资源,旨在帮助开发者提升技能和效率。以下是一些从提供的文件名中提炼出的关键知识点: 1. **jsp技巧.txt**:这可能涉及到JavaServer...

    js技巧 javaScript编码技巧

    以上技巧和知识点在200个js技巧.docx文档中可能有更详尽的解释和实例,建议深入学习,结合实践以提升JavaScript编程技能。同时,不断关注JavaScript的最新发展,如ES规范的更新,以及社区的最佳实践,将有助于你成为...

    javascript非常实用的技巧

    在开发应用中,绝对实用的javascript技巧,一点都不花哨

    JavaScript小技巧整理篇(非常全).pdf

    本文档旨在总结一系列JavaScript编程中的实用技巧,涵盖从基本操作到高级功能的应用。这些技巧不仅有助于提升开发效率,还能帮助开发者更好地理解和掌握JavaScript语言。 #### 二、重要技巧详解 ##### 2.1 使用 `=...

    JavaScript Array对象详解-javascript技巧.pdf

    JavaScript Array对象详解_javascript技巧

    javascript方法和技巧大全

    ### JavaScript方法和技巧详解 #### 一、基本概念与语法结构 **JavaScript**是一种轻量级的编程语言,被广泛应用于网页开发中,用于增强网页的交互性与动态效果。以下是一些基本的语法和使用技巧。 ##### 1. 嵌入...

    收集的javascript 技巧

    本文旨在从一个帖子中提炼出的JavaScript技巧与方法进行深入解析,帮助读者更全面地理解和掌握这门语言。 #### 基础知识 **创建脚本块** 在HTML中嵌入JavaScript最常见的方式是通过`&lt;script&gt;`标签。语法结构如下...

    Javascript 技巧大全Javascript 技巧大全

    Javascript 技巧大全Javascript 技巧大全Javascript 技巧大全Javascript 技巧大全Javascript 技巧大全Javascript 技巧大全

    JavaScript编程技巧

    JavaScript,简称为JS,是一种广泛应用于网页和网络应用的脚本语言,主要负责网页的动态化和交互功能。它基于ECMAScript规范,是Web开发不可或缺的一部分。在本压缩包中,"JavaScript编程技巧"提供了丰富的函数示例...

    JavaScript技巧200多个

    这个名为"JavaScript技巧200多个"的资源显然包含了大量实用的编程技巧,可以帮助开发者提升JavaScript编程效率和代码质量。以下是一些可能包含在JS技巧200个.txt文件中的关键知识点: 1. **变量声明与作用域**:...

    JavaScript方法和技巧大全

    JavaScript是一种广泛应用于网页和网络应用的编程语言,它与HTML和CSS一起构成了现代网页开发的基础。这篇文章主要聚焦于JavaScript的一些基本方法和实用技巧,旨在帮助无论是初学者还是有一定经验的开发者提升...

    百例JavaScript技巧

    "百例JavaScript技巧"这个主题覆盖了各种实用的JavaScript编程技巧,旨在帮助开发者提升技能,提高工作效率。以下是根据这个主题可能会涵盖的一些关键知识点: 1. **基础语法**:JavaScript的基础包括变量声明(var...

    Javascript 实用小技巧

    在本篇标题为“Javascript实用小技巧”的文章中,作者分享了一系列实用的JavaScript代码片段,旨在帮助学习JavaScript的人士掌握一些提高编程效率的技巧。文章内容涉及了JavaScript的Function对象的apply和call方法...

    JavaScript技巧

    JavaScript技巧

    javascript技巧(珍藏版)

    ### JavaScript技巧(珍藏版) 在本篇珍藏已久的JavaScript技巧分享中,我们将深入探讨一些实用且高效的JavaScript小技巧,这些技巧旨在帮助新手快速提升编程技能,并为日常开发带来便利。 #### 技巧1:类型转换 在...

    一套基于纯js实现的JavaScript典型应用技巧例子源码

    本套源码集合是一系列基于纯JavaScript实现的典型应用技巧实例,旨在帮助开发者深入理解和掌握JavaScript的核心特性和实战技能。以下是这些源码所涵盖的一些关键知识点: 1. **基础语法**:JavaScript的基础包括...

    JavaScript方法和技巧大全.doc

    本文档,"JavaScript方法和技巧大全.doc",旨在为初学者提供一个全面的指南,帮助他们掌握JavaScript的基础知识和实用技巧。 首先,让我们从基础开始。在HTML中,JavaScript代码通常嵌入在`&lt;script&gt;`标签内,如`...

    javascript技巧与方法大全

    JavaScript是一种广泛应用于网页和网络应用的编程语言,它在网页中负责实现动态效果、交互功能以及数据处理。本文将深入探讨一些JavaScript的基础知识、技巧和方法。 首先,创建JavaScript脚本块是通过`&lt;script&gt;`...

Global site tag (gtag.js) - Google Analytics