web12.10

Math对象：

 

random() 随机数   在0-1之间

 

round()  四舍五入

 

ceil（）  向上舍入

 

floor()  向下舍入

 

max()  最大值

 

min()  最小值

 

PI  表示pi

 

随机数：

例：

<p class="one"></p>
<script>
   function show(){
       x=Math.floor(Math.random()*10);
       document.getElementsByClassName("one")[0].innerHTML=x;

   }
   setInterval("show()",1000);
</script>

 

Date对象：

获取：new Date()

 

.toLocaleString()

.toLocaleTimeString()

.toLocaleDateString()

 

   get Month    返回月份0到10

   get Date      月中的某一天，日

   get Day       星期中的某一天

   get Full year   年

   get Hourse    时

   get Seconds   秒

 

 

计时器：

setInterval()   间隔指定的毫秒数执行指定的代码

clearInterval()  清除计时器

 

setTimeout()

clearTimeout()

 

<p>距离2018年1月1日还差:<span class="times"></span></p>
<script>
    function show(){
        var oldtime=new Date(2018,0,1,0,0,0).getTime();
        var newtime=new Date().getTime();
        var time=parseInt((oldtime-newtime)/1000);
        var tian=Math.floor(time/(24*60*60));
        var hours=Math.floor((time-tian*24*60*60)/3600);
        var min=Math.floor((time-tian*24*60*60-hours*3600)/60);
        var sec=Math.floor(time-tian*24*60*60-hours*3600-min*60);
        document.getElementsByClassName("times")[0].innerHTML=tian+"天"
        +hours+"小时"+min+"分"+sec+"秒";
    }
         var timer=setInterval("show()",1000);
     //  window.οnlοad=show;
         window.onload=function(){
             show()
         }

</script>

 

 

 

 

string对象

属性

length 长度

 

方法：

 

charAt(index)  返回指定位置的字符  //index表示位置，从0开始；

charCodeAt()    返回指定位置的字符unicode编码

concat() 方法用于连接两个或多个字符串。

fromCharCode()  把指定的unicode编码转换成为字符串

 

indexOf(要查找的字符串，[起始位置])   返回指定字符在字符串中首次出现的位置，如果没有找到则返回-1;

 

slice(star,end)截取字符串的一部分，并返回新的字符串    star表示截取的起始位置，end表示截取的结束位置   位置从0开始

 

split(x,[y])  分割字符串成字符串数组；  x表示分割的参考对象，y是可选项，y表示设置分割成数组个数；

 

substr(a,l)  提取字符串，a表示起始的索引位置，l表示要提取的字符串的长度；

 

substring(s,e)   提取字符串 s 表示起始索引位置，e表示结束的索引位置，包含s，不包含e位置；

 

 

<form  novalidate></form>

 

 novalidate禁止浏览器默认验证

 trim()   将两头的空格去掉

toLowerCase()   变成小写

 

 

 

array  数组对象

方法：

concat()连接两个或多个数组；

pop()删除最后一个元素

shift()删除第一个元素

push(） 向数组末尾添加一个或多个元素

unshift（） 向数组开头添加一个或多个元素

 

splice() 方法用于插入、删除或替换数组的元素。

splice(index,how,[news])

 

// index 表示添加或删除的位置

// how  为0 表示添加，如果数大于0表示删除个数，如果未规定此参数，则删除从 index 开始到原数组结尾的所有元素。

//news  为可选项，表示添加的元素

 

reverse() 方法用于颠倒数组中元素的顺序。

 

join() 方法用于把数组中的所有元素转换一个字符串。

 

排序：

sort 排序（默认对字母排序）

冒泡排序法：

例子：

var elements=[3, 1, 5, 7, 2, 10, 8, 9, 4, 6];
 function sort(elements){
     for(var i=0;i<elements.length-1;i++){
         for(var j=0;j<elements.length-i-1;j++){
             if(elements[j]>elements[j+1]){
                var one=elements[j];
                 elements[j]=elements[j+1];
                 elements[j+1]=one;
             }
         }
     }
 }

 

 

 

getAttribute(“属性名”)                      获取属性值

 

setAttribute("属性名“，”新的属性值 “)      设置属性值  

 

获取子元素

childNodes()   包含空节点

 

children()   不包含空节点

 

第几个子节点：  childNodes[index]   /children[index]

 

 

firstChild   第一个子节点

lastChild    最后一个子节点

 

 

firstElementChild   不包含空第一个子节点

lastElementChild    不包含空最后一个子节点

 

parentNode()    父节点

 

兄弟节点

 

nextSibling   下一个兄弟节点包含空节点

previousSibling  前一个兄弟节点包含空节点

 

nextElementSibling  下一个兄弟节点 不包含空节点、

previousElementSibling 前一个兄弟节点不包含空节点

 

offsetParent   第一个有定位属性的父节点，如果没有则返回body

 

document.createElement("要添加的节点标签名")   创建元素节点

 

父节点.appendChild(新节点)    在父节点的内部后面插入新节点

 

insertBefore(新节点，子节点)   把新节点内容添加到子节点的前面   

 

 

创建节点：

   document.creatElement(“标签名”)

插入节点：

   (插入位置).append Child(“新节点名”)

 

insertBefore（新节点，位置）    //在前面插入

 

删除节点：removeChild

<ul>
    <li>1111</li>
    <li>22222</li>
    <li>333333</li>
</ul>
<button>删除</button>

<script>
    var btn=document.getElementsByTagName("button")[0];
    btn.onclick=function(){
        var ul=document.getElementsByTagName("ul")[0]
                ul.removeChild(ul.firstElementChild);
    }
</script>

 

替换元素节点：replaceChild
<h3>hello,h3</h3>
<button>替换</button>
<script>
    var btn=document.getElementsByTagName("button")[0];
    var oldnode=document.getElementsByTagName("h3")[0];
    btn.onclick=function(){
        var newp=document.createElement("p");
        newp.innerHTML="我是新建的一个p标签";
       oldnode.parentNode.replaceChild(newp,oldnode)
    }
</script>

 

 

事件：

 

onkeydown 某个键盘按键被按下。

onkeypress 某个键盘按键被按下并松开。

onkeyup 某个键盘按键被松开。

 

 

事件冒泡  （从里到外）

 

事件捕获   （从外到里）

 

阻止事件冒泡

 

1、event.stopPropagation();  阻止冒泡

2、event.preventDefault();   阻止默认事件

 

  阻止超链接默认事件：<a href="javascript:void(0)">百度</a>

 

3、return false;阻止默认事件，阻止冒泡事件；

 

 

监听事件：

  addEventListener

  

语法：element.addEventListener(event, function , userCapeture)

 

点击：click/mouseover    //不用”on”