开发者社区> 执久呀> 正文
阿里云
为了无法计算的价值
打开APP
阿里云APP内打开

【JavaScript】setlntval函数和内置类..

简介: ​ 目录 去除前后空白trim 复选框的全选和取消全选  获取系统当前时间  周期函数setInterval  内置支持类Array
+关注继续查看

BOM编程

消息框弹出(alert、confirm)

history和location对象

去除前后空白trim

document.getElementById("btn").onclick=function(){
 var value=document.getElementById("username").value;  
 var newValue=value.trim();
  alert("--->"+newValue+"<----")
}

}




效果:

在IE8不支持trim,所以可以使用prototype扩展这个函数。如

//给String扩展trim

alert("调用自己写的trim");

//正则对象:/.../
//return this.replace(/^\s+/,"").replace(/\s+$/,"");
return this.replace(/^\s+|\s+$/g,"");
}


小test

复选框的全选和取消全选

    window.onload =function(){
        //给每个复选框绑onclick事件
        var firstChk =document.getElementById("firstChk");
        firstChk.onclick =function(){
        //根据name获得那个值
          aihaos = document.getElementsByName("aihao");
        // 
            for(var i =0; i<aihaos.length; i++){
                aihaos[i].checked =firstChk.checked;
        
            }
        }
        var all=aihaos.length;
        for(var i = 0; i < aihaos.length; i++){
            aihaos[i].onclick =function(){
            var checkedCount =0;
            //  总数量和选中的数量相等的时候,第一个复选框选中
                for(var i = 0; i<aihaos.length; i++){
                        if(aihaos[i].checked){
                        checkedCount++;
                    }
                }
                    firstChk.checked =(all== checkedCount);
                    /*
                    if(all ==checkedCount){
                    firstChk.checked =true;
                    } else{
                    firstChk.checked =false;}*/
               
             }
       }
   }

 <input type="checkbox" id="firstChk"/><br>
  <input type="checkbox" name="aihao" value="smoke"/>抽烟<br>
  <input type="checkbox" name="aihao" value="drink"/>喝酒<br>
    <input type="checkbox" name="aihao" value="tt"/>烫头<br> 

 获取系统当前时间
js中的内置支持类Date,可以用来获取时间/日期


运行结果:

var nowTime=new Date();
nowTime=nowTime.toLocaleString();
//输出
document.write(nowTime);
运行结果:

 js中的换行,在script中不能直接写br。

document.write("
")
获取毫秒数


 运行结果:

 周期函数setInterval

<script type= text/javascript>
  function displayTime(){
    var time = new Date();
    var strTime =time.toLocaleString();
    document.getElementById("timeDiv").innerHTML=strTime;
}
  //每隔1秒调用displayTime()函数 
  function start(){
      //从这行代码执行结束开始,则会不间断的,每隔1000毫秒调用一次displayTime()函数。
     //它的返回值可以传递给clearInterval从而取消code周期执行的值
     v=window.setInterval("displayTime()",1000);
  }
     //让时间停下
  function stop() {
    window.clearInterval(v);
    
  }
  </script>
  <br><br>
  <input type="button" value="显示系统时间" onclick="start();"/>
  <input type="button" value="系统时间停止" onclick="stop();"/>
  <div id="timeDiv"></div>

 内置支持类Array

//创建长度为0的数组
var arr=[];
//求数组长度
arr.length

var arr2=[1,false,true,"kongchao",null];

for(var i=0;i<arr.length;i++){
document.write(arr[i]+"
");
}

如arr中长度有5,直接arr[7]=true;则会

var arr=[1,false,true,"kongchao",null];
arr[7]=true;
for(var i=0;i<arr.length;i++){
document.write(arr[i]+"
");
}

var arr =new Array();//创建数组长度为0
var arr =new Array(5);//创建数组长度为5
var arr =new Array(1,2);//创建数组长度为2,表示其中有两个值1,2
 join方法链接

var a = [1,2,3,9];
var str =a.join("-");
alert(str);//"1-2-3-9"

//在数组的末尾添加一个元素(数组长度+1)
var a = [1,2,3,9];
a.push(10);
alert(a.join("-"));
//将数组末尾的元素弹出
var endElt =a.pop();
alert(endElt);

反转数组:reverse()
//反转数组
var a = [1,2,3,9];
a.reverse();
var str =a.join("-");
alert(str);

BOM编程
window中open和close方法
<input type="button" value="开启百度" onclick="window.open('http://www.baidu.com')"
//新窗口开启
<input type="button" value="开启百度" onclick="window.open('http://www.baidu.com',_blank)"
//父窗口开启
<input type="button" value="父窗口开启百度" onclick="window.open('http://www.baidu.com',_parent)";
//顶级窗口
<input type="button" value="顶级窗口开启百度" onclick="window.open('http://www.baidu.com',_top)"


关闭当前窗口


消息框弹出(alert、confirm)

window.confirm();//弹出消息确认框
window.alert();
 示例:

function again(){
  if(window.confirm("你确定要删除这数据??")){
    alert("delete date..") 
  }

}

history和location对象
history

//后退

//后退

//前进

location

location获取地址栏

function goBaidu(){
// var location0bj=window.location;//写法1
// locationObj.href="http://www.baidu.com";

  window .location.href ="http://www.jd.com";//写法2
  //window.location="http://www.126.com";
  

  //  document.location.href ="http://www.sina.com.cn"; //写法3
  // document.location="http://www.tmall.com";
}
</script>
<input type="button" value="百度" onclick="goBaidu();"/>

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
JavaScript函数(Function)
JavaScript函数(Function) 函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。
48 0
js中的函数function
<p>    js的function对象在调用过程中具有一个arguments的属性,它是由脚本解释器创建的(这也是arguments创建的唯一方式)。arguments属性可以看作是一个Array对象,它有length属性,可以通过序号访问每一个参数,而且通过argument的callee属性可以获取对正在执行的Function对象的引用。如下:</p> <p></p> <pre na
1004 0
JavaScript中Promises/A+规范的实现
Promises是一种异步编程模型,通过一组API来规范化异步操作,这样也能够让异步操作的流程控制更加容易。
42 0
用手动创建新的script标签的方式,实现JavaScript脚本的异步加载
用手动创建新的script标签的方式,实现JavaScript脚本的异步加载
51 0
几种常用的排序算法之JavaScript实现
几种常用的排序算法之JavaScript实现
68 0
分享一个开源的JavaScript统计图表库,40行代码实现专业统计图表
分享一个开源的JavaScript统计图表库,40行代码实现专业统计图表
157 0
使用Chrome开发者工具研究JavaScript里函数的原生实现
使用Chrome开发者工具研究JavaScript里函数的原生实现
58 0
hash排序(哈希排序)的一个JavaScript实现,支持负数
hash排序(哈希排序)的一个JavaScript实现,支持负数
43 0
+关注
执久呀
CSDN新星博主执久呀
文章
问答
文章排行榜
最热
最新
相关电子书
更多
Javascript中的函数
立即下载
Javascript中的对象
立即下载
JavaScript 语言在引擎级别的执行过程
立即下载