Warning: error_log(/data/www/wwwroot/hmttv.cn/caches/error_log.php): failed to open stream: Permission denied in /data/www/wwwroot/hmttv.cn/phpcms/libs/functions/global.func.php on line 537 Warning: error_log(/data/www/wwwroot/hmttv.cn/caches/error_log.php): failed to open stream: Permission denied in /data/www/wwwroot/hmttv.cn/phpcms/libs/functions/global.func.php on line 537 国产成人精品女人不卡在线,91高清国产视频,男女爽爽大片 

      

        

          



          
	
          
		
          
			
			
          
				
          整合營銷服務(wù)商
          
				
          電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
          
			
          
			
          				
				
          免費(fèi)咨詢熱線：
          			
			
          
		
          
	
          
		
	
	
	

          


          
	

          

 

          
  
          
    
          
      
          
        
          HTML 中 DOM的使用，知道這些就夠了
          
        
           
          
	
	
          
		
                        
          TML DOM (文檔對象模型)
          當(dāng)網(wǎng)頁被加載時(shí)，瀏覽器會(huì)創(chuàng)建頁面的文檔對象模型（Document Object Model）。
          HTML DOM 定義了用于 HTML 的一系列標(biāo)準(zhǔn)的對象，以及訪問和處理 HTML 文檔的標(biāo)準(zhǔn)方法。通過 DOM，你可以訪問所有的 HTML 元素，連同它們所包含的文本和屬性。
          HTML DOM 模型被構(gòu)造為對象的樹：

          查找 HTML 元素
          //通過 id 查找 HTML 元素
var x=document.getElementById("intro");

//通過標(biāo)簽名查找 HTML 元素
var x=document.getElementById("main");
var y=x.getElementsByTagName("p");

//通過類名找到 HTML 元素
var x=document.getElementsByClassName("intro");
          HTML DOM 改變 HTML 內(nèi)容
          //改變 HTML 輸出流
document.write(Date());
//絕對不要在文檔加載完成之后使用,用btn點(diǎn)擊事件執(zhí)行 document.write()。這會(huì)覆蓋該文檔。

//改變 HTML 內(nèi)容
document.getElementById(id).innerHTML=new HTML

//改變 HTML 屬性
document.getElementById(id).attribute=new value
          HTML DOM 改變 CSS
          //改變 HTML 樣式
document.getElementById("p2").style.color="blue";
document.getElementById("p2").style.fontFamily="Arial";
document.getElementById("p2").style.fontSize="larger";

<h1 id="id1">我的標(biāo)題 1</h1>
<button type="button" onclick="document.getElementById('id1').style.color='red'">
點(diǎn)我!</button>
          HTML DOM 事件
          //對事件做出反應(yīng)
<h1 onclick="this.innerHTML='Ooops!'">點(diǎn)擊文本!</h1>

<script>
function changetext(id){
	id.innerHTML="Ooops!";
}
</script>
</head>
<body>
<h1 onclick="changetext(this)">點(diǎn)擊文本!</h1>
</body>


//HTML 事件屬性
<body>
<p>點(diǎn)擊按鈕執(zhí)行 <em>displayDate()</em> 函數(shù).</p>
<button onclick="displayDate()">點(diǎn)我</button>
<script>
function displayDate()
{
	document.getElementById("demo").innerHTML=Date();
}
</script>
<p id="demo"></p>
</body>


//使用 HTML DOM 來分配事件
document.getElementById("myBtn").onclick=function(){displayDate()};

//onchange 事件
<script>
function myFunction(){
	var x=document.getElementById("fname");
	x.value=x.value.toUpperCase();
}
</script>
</head>
<body>
輸入你的名字: <input type="text" id="fname" onchange="myFunction()">
<p>當(dāng)你離開輸入框后，函數(shù)將被觸發(fā)，將小寫字母轉(zhuǎn)為大寫字母。</p>
</body>
          HTML DOM 事件監(jiān)聽器
          //addEventListener() 方法
<body>
<p>該實(shí)例使用 addEventListener() 方法在按鈕中添加點(diǎn)擊事件。 </p>
<button id="myBtn">點(diǎn)我</button>
<p id="demo"></p>
<script>
document.getElementById("myBtn").addEventListener("click", displayDate);
function displayDate() {
    document.getElementById("demo").innerHTML = Date();
}
</script>
</body>

//向原元素添加事件句柄
<body>
<p>該實(shí)例使用 addEventListener() 方法在按鈕中添加點(diǎn)擊事件。 </p>
<button id="myBtn">點(diǎn)我</button>
<script>
document.getElementById("myBtn").addEventListener("click", function(){
    alert("Hello World!");
});
</script>

//向同一個(gè)元素中添加多個(gè)事件句柄
<body>
<p>該實(shí)例使用 addEventListener() 方法向同個(gè)按鈕中添加兩個(gè)點(diǎn)擊事件。</p>
<button id="myBtn">點(diǎn)我</button>
<script>
var x = document.getElementById("myBtn");
x.addEventListener("click", myFunction);
x.addEventListener("click", someOtherFunction);
function myFunction() {
    alert ("Hello World!")
}
function someOtherFunction() {
    alert ("函數(shù)已執(zhí)行!")
}
</script>
</body>
          HTML DOM 元素
          在文檔對象模型 (DOM) 中，每個(gè)節(jié)點(diǎn)都是一個(gè)對象。DOM 節(jié)點(diǎn)有三個(gè)重要的屬性，分別是：
          1. nodeName : 節(jié)點(diǎn)的名稱
          2. nodeValue ：節(jié)點(diǎn)的值
          3. nodeType ：節(jié)點(diǎn)的類型
          創(chuàng)建新的 HTML 元素
          <body>
<div id="div1">
<p id="p1">這是一個(gè)段落。</p>
<p id="p2">這是另一個(gè)段落。</p>
</div>
<script>
var para=document.createElement("p");
var node=document.createTextNode("這是一個(gè)新段落。");
para.appendChild(node);
var element=document.getElementById("div1");
element.appendChild(para);
</script>
          刪除已有的 HTML 元素
          <body>
<div id="div1">
	<p id="p1">這是一個(gè)段落。</p>
	<p id="p2">這是另一個(gè)段落。</p>
</div>
<script>
var parent=document.getElementById("div1");
var child=document.getElementById("p1");
parent.removeChild(child);
</script>
</body>


          以上內(nèi)容整理于網(wǎng)絡(luò)，如有侵權(quán)請聯(lián)系刪除。
          ：jQuery 事件
          1、事件處理程序指的是當(dāng) HTML 中發(fā)生某些事件時(shí)所調(diào)用的方法
          3、常見 DOM 事件
          1、click鼠標(biāo)點(diǎn)擊事件
          2、鼠標(biāo)雙擊事件
          3、鼠標(biāo)指針浮與上空事件
          4、鍵盤按下松開事件
          5、鼠標(biāo)指針懸停事件
          6、表單提交事件
          7、元素的值改變時(shí)發(fā)生 change 事件
          8、元素獲得焦點(diǎn)時(shí)事件
          9、元素失去焦點(diǎn)事件
          面的話
          鼠標(biāo)事件是web開發(fā)中最常用的一類事件，畢竟鼠標(biāo)是最主要的定位設(shè)備。本文將詳細(xì)介紹鼠標(biāo)事件的內(nèi)
          類型
          鼠標(biāo)事件共10類，包括click、contextmenu、dblclick、mousedown、mouseup、mousemove、mouseover、mouseout、mouseenter和mouseleave
          click 當(dāng)用戶按下并釋放鼠標(biāo)按鍵或其他方式“激活”元素時(shí)觸發(fā)
          contextmenu 可以取消的事件，當(dāng)上下文菜單即將出現(xiàn)時(shí)觸發(fā)。當(dāng)前瀏覽器在鼠標(biāo)右擊時(shí)顯示上下文菜單
          dblclick 當(dāng)用戶雙擊鼠標(biāo)時(shí)觸發(fā)
          mousedown 當(dāng)用戶按下鼠標(biāo)按鍵時(shí)觸發(fā)
          mouseup 當(dāng)用戶釋放鼠標(biāo)按鍵時(shí)觸發(fā)
          mousemove 當(dāng)用戶移動(dòng)鼠標(biāo)時(shí)觸發(fā)
          mouseover 當(dāng)鼠標(biāo)進(jìn)入元素時(shí)觸發(fā)。relatedTarget (在IE中是fromElement)指的是鼠標(biāo)來自的元素
          mouseout 當(dāng)鼠標(biāo)離開元素時(shí)觸發(fā)。relatedTarget (在IE中是toElement)指的是鼠標(biāo)要去往的元素
          mouseenter 類似mouseover，但不冒泡。IE將其引入，HTML5將其標(biāo)準(zhǔn)化，但 尚未廣泛實(shí)現(xiàn)
          mouseleave 類似mouseout，但不冒泡。IE將其引入，HTML5將其標(biāo)準(zhǔn)化，但尚未廣泛實(shí)現(xiàn)
          冒泡
          頁面上的所有元素都支持鼠標(biāo)事件，除了mouseenter和mouseleave事件外，所有的鼠標(biāo)事件都會(huì)冒泡
          [注意]safari瀏覽器不支持mouseenter和mouseleave事件
          <button id="test" style="height: 30px;width: 200px;"></button><script>//鼠標(biāo)移入移出按鈕時(shí)，顯示false，表示不冒泡test.onmouseenter = test.onmouseleave =function(e){
          test.innerHTML += e.bubbles;//false}</script>
          <button id="test" style="height: 30px;width: 200px;"></button><script>//鼠標(biāo)移入移出按鈕時(shí)，顯示true，表示冒泡test.onmouseover = test.onmouseout =function(e){
          test.innerHTML += e.bubbles;//true}</script>
          順序
          【1】鼠標(biāo)移入時(shí)，觸發(fā)mouseover、mouseenter和mousemove事件
          IE瀏覽器會(huì)先觸發(fā)一次mousemove事件，再觸發(fā)mouseover和mouseenter事件，再觸發(fā)多次mousemove事件
          而其他瀏覽器都是先觸發(fā)mouseover和mouseenter事件，再觸發(fā)多次mousemove事件
          <div id="box" style="height:30px;width:200px;background:pink;"></div><button id="reset">還原</button><script>reset.onclick = function(){history.go();}var oBox = document.getElementById('box');
          oBox.onmouseover = oBox.onmouseenter=oBox.onmousemove =function(e){
          e = e || event;
          box.innerHTML += e.type+ ';';
          }</script>
          【2】鼠標(biāo)移出時(shí)，觸發(fā)mousemove、mouseleave和mouseout事件
          所有瀏覽器的順序都是(1)mousemove、(2)mouseout和(3)mouseleave事件
          <div id="box" style="height:30px;width:200px;background:pink;"></div><button id="reset">還原</button><script>reset.onclick = function(){history.go();}var oBox = document.getElementById('box');
          oBox.onmouseleave = oBox.onmouseout=oBox.onmousemove =function(e){
          e = e || event;
          box.innerHTML += e.type+ ';';
          }</script>
          【3】雙擊鼠標(biāo)時(shí)，觸發(fā)mousedown、mouseup、click、dblclick事件
          一般地，瀏覽器的順序是(1)mousedown、(2)mouseup、(3)click、(4)mousedown、(5)mouseup、(6)click、(7)dblclick
          但I(xiàn)E8-瀏覽器有一個(gè)小bug，在雙擊事件中，它會(huì)跳過第二個(gè)mousedown和click事件，順序?yàn)?1)mousedown、(2)mouseup、(3)click、(4)mouseup、(5)dblclick
          <div id="box" style="height:30px;width:200px;background:pink;"></div><button id="reset">還原</button><script>reset.onclick = function(){history.go();}var oBox = document.getElementById('box');
          oBox.onclick = oBox.ondblclick = oBox.onmousedown = oBox.onmouseup=function(e){
          e = e || event;
          box.innerHTML += e.type+ ';';
          }</script>
          【4】點(diǎn)擊鼠標(biāo)右鍵時(shí)，觸發(fā)mousedown、mouseup、contextmenu事件
          一般地，瀏覽器的順序是(1)mousedown、(2)mouseup、(3)contextmenu
          但safari瀏覽器有一個(gè)小bug，它不觸發(fā)mouseup事件，順序?yàn)?1)mousedown、(2)contextmenu
          <div id="box" style="height:30px;width:200px;background:pink;"></div><button id="reset">還原</button><script>reset.onclick = function(){history.go();}var oBox = document.getElementById('box');
          oBox.oncontextmenu = oBox.onmousedown = oBox.onmouseup=function(e){
          e = e || event;
          box.innerHTML += e.type+ ';';
          }</script>
          【5】嵌套元素的移入移出時(shí)，觸發(fā)mouseover、mouseenter、mouseleave、mouseout事件
          從父級元素進(jìn)入子級元素時(shí)，順序?yàn)?(1)父級元素的mouseout、(2)子級元素的mouseover、(3)父級元素的mouseover、(4)子級元素的mouseenter
          從子級元素進(jìn)入父級元素時(shí)，順序?yàn)?(1)子級元素的mouseout、(2)父級元素的mouseout、(3)子級元素的mouseleave、(4)父級元素的mouseover
          <div id="box" style="padding: 50px;width: 100px;background:pink;">
          <div id="inner" style="height: 100px;width: 100px;background-color: lightblue;"></div></div><button id="reset">還原</button><script>reset.onclick = function(){history.go();}
          inner.onmouseout=inner.onmouseleave=inner.onmouseover=inner.onmouseenter=box.onmouseout=box.onmouseleave=box.onmouseover=box.onmouseenter= function(e){
          inner.innerHTML += e.currentTarget.id.slice(0,1) + ':' +e.type.slice(5) + ';';
          }</script>
          從上面的結(jié)果可以看出mouseover、mouseout和mouseleave和mouseenter事件的區(qū)別
          1、mouseover、mouseout是冒泡的，而mouseleave和mouseenter是不冒泡的
          2、從父級元素進(jìn)入子級元素時(shí)，不會(huì)觸發(fā)父級元素的mouseleave事件
          3、從子級元素進(jìn)入父級元素時(shí)，不會(huì)觸發(fā)父級元素的mouseenter事件
          事件對象
          鼠標(biāo)事件對象提供了豐富的信息，接下來將按照功能分類介紹
          坐標(biāo)位置
          關(guān)于坐標(biāo)位置，事件對象提供了clientX/Y、pageX/Y、screenX/Y、x/y、offsetX/Y、layerX/Y這6對信息
          clientX/Y與x/y
          clientX/Y表示鼠標(biāo)指針在可視區(qū)域中的水平和垂直坐標(biāo)
          x/y與clientX/Y相同，但有兼容問題。firefox瀏覽器不支持x/y，且IE7-瀏覽器把視口的左上角坐標(biāo)設(shè)置為(2,2)，其他瀏覽器則將(0,0)作為起點(diǎn)坐標(biāo)，所以存在(2,2)的差距
          <div id="box" style="height:100px;width:200px;background:pink;"></div><script>box.onmousemove=function(e){
          e = e || event;
          box.innerHTML = 'clientX:' + e.clientX +';clientY:'+e.clientY + '<br>x:' + e.x + ';y:' + e.y;
          }</script>
          screenX/Y
          screenX/Y表示鼠標(biāo)指針相對于屏幕的水平和垂直坐標(biāo)
          <div id="box" style="height:100px;width:200px;background:pink;"></div><script>box.onmousemove=function(e){
          e = e || event;
          box.innerHTML = 'clientX:' + e.clientX +';clientY:'+e.clientY + '<br>screenX:' + e.screenX + ';screenY:' + e.screenY;
          }</script>
          pageX/Y與layerX/Y
          pageX/Y表示相對于頁面的水平和垂直坐標(biāo)，它與clientX/clientY的區(qū)別是不隨滾動(dòng)條的位置變化
          layerX/Y與pageX/Y相同
          <body style="height:2000px;"><div id="box" style="height:100px;width:300px;background:pink;"></div><div id="result"></div><script>var oBox = document.getElementById('box');
          oBox.onmousemove=function(e){
          e = e || event;
          result.innerHTML = 'clientX:' + e.clientX +';clientY:'+e.clientY + '<br>pageX:' + e.pageX + ';pageY:' + e.pageY;
          }</script></body>
          [注意]IE8-瀏覽器不支持pageX/Y和layerX/Y，不過可以根據(jù)scrollTop/Left和clientX/Y計(jì)算出來
          兼容
          handler = function(e){
          e = e || event;
          if(e.pageX == undefined){
          e.pageX = e.clientX + document.documentElement.scrollLeft
          }
          if(e.pageY == undefined){
          e.pageY = e.clientY + document.documentElement.scrollTop
          }
          }
          offsetX/Y
          offsetX/Y表示相對于定位父級的水平和垂直坐標(biāo)
          當(dāng)頁面無定位元素時(shí)，body是元素的定位父級。由于body的默認(rèn)margin是8px，所以offsetX/Y與clientX/Y差(8,8)
          <div id="box" style="height:100px;width:300px;background:pink;"></div><script>var oBox = document.getElementById('box');
          oBox.onmousemove=function(e){
          e = e || event;
          oBox.innerHTML = 'clientX:' + e.clientX +';clientY:'+e.clientY + '<br>offsetX:' + e.offsetX + ';offsetY:' + e.offsetY;
          }</script>
          修改鍵
          雖然鼠標(biāo)事件主要是使用鼠標(biāo)來觸發(fā)的，但在按下鼠標(biāo)時(shí)鍵盤上的某些鍵的狀態(tài)也可以影響到所要采取的操作
          這些修改鍵就是Shift、Ctrl、Alt和Meta(在Windows鍵盤中是Windows鍵，在蘋果機(jī)中是Cmd鍵)，它們經(jīng)常被用來修改鼠標(biāo)事件的行為
          DOM為此規(guī)定了4個(gè)屬性，表示這些修改鍵的狀態(tài)：shiftKey、ctrlKey、altKey和metaKey。這些屬性中包含的都是布爾值，如果相應(yīng)的鍵被按下了，則值為true；否則值為false
          [注意]IE8-瀏覽器不支持metaKey屬性
          下面通過點(diǎn)擊事件，來測試是否在點(diǎn)擊的時(shí)候按下了這些修改鍵
          <div id="box" style="height:30px;width:300px;background:pink;"></div><script>box.onclick=function(e){
          e = e || event;
          box.innerHTML = ''; if(e.shiftKey){box.innerHTML += 'shiftKey;'} if(e.ctrlKey){box.innerHTML += 'ctrlKey;'} if(e.altKey){box.innerHTML += 'altKey;'} if(e.metaKey){box.innerHTML += 'metaKey;'}
          }</script>
          相關(guān)元素
          relatedTarget屬性返回事件的次要相關(guān)節(jié)點(diǎn)。對于那些沒有次要相關(guān)節(jié)點(diǎn)的事件，該屬性返回null
          對mouseover事件而言，事件的主目標(biāo)target是獲得光標(biāo)的元素，而相關(guān)元素relatedTarget就是那個(gè)失去光標(biāo)的元素
          下表列出不同事件的target屬性和relatedTarget屬性含義
          事件名稱 　　target屬性 relatedTarget屬性
          focusin 接受焦點(diǎn)的節(jié)點(diǎn) 喪失焦點(diǎn)的節(jié)點(diǎn)
          focusout 　喪失焦點(diǎn)的節(jié)點(diǎn) 接受焦點(diǎn)的節(jié)點(diǎn)
          mouseenter 將要進(jìn)入的節(jié)點(diǎn) 將要離開的節(jié)點(diǎn)
          mouseleave 將要離開的節(jié)點(diǎn) 將要進(jìn)入的節(jié)點(diǎn)
          mouseout 將要離開的節(jié)點(diǎn) 將要進(jìn)入的節(jié)點(diǎn)
          mouseover 將要進(jìn)入的節(jié)點(diǎn) 將要離開的節(jié)點(diǎn)
          dragenter 將要進(jìn)入的節(jié)點(diǎn) 將要離開的節(jié)點(diǎn)
          dragexit 將要離開的節(jié)點(diǎn) 將要進(jìn)入的節(jié)點(diǎn)
          IE8-瀏覽器不支持target和relatedTarget屬性
          兼容
          target可以用srcElement屬性替代，relatedTarget可以用toElement屬性替代
          [注意]srcElement和toElement屬性firefox瀏覽器不支持
          下列代碼中， div元素的mouseover事件是從<body>移入到<div>中
          <div id="box" style="height:100px;width:400px;background:pink;"></div><button id="reset">還原</button><script>reset.onclick = function(){history.go();}
          box.onmouseover=function(e){
          e = e || event;
          box.innerHTML = 'target:' + (e.target||e.srcElement) +'<br>relatedTarget:'+(e.relatedTarget||e.toElement) ;
          }</script>
          鼠標(biāo)按鍵
          button和buttons屬性返回事件鼠標(biāo)按鍵信息
          button
          button屬性返回一個(gè)數(shù)值，表示按下了鼠標(biāo)哪個(gè)鍵
          [注意]若不阻止右鍵默認(rèn)行為，safari瀏覽器無法表示按下右鍵
          -1 表示沒有按下按鍵
          0 表示按下左鍵
          1 表示按下滾輪
          2 表示按下右鍵
          buttons
          buttons屬性返回一個(gè)3個(gè)比特位的值，表示同時(shí)按下了哪些鍵。它用來處理同時(shí)按下多個(gè)鼠標(biāo)鍵的情況
          [注意]safari瀏覽器不支持buttons屬性
          1 二進(jìn)制為001，表示按下左鍵
          2 二進(jìn)制為010，表示按下右鍵
          4 二進(jìn)制為100，表示按下滾輪
          所以，同時(shí)按下左鍵和右鍵，buttons的二進(jìn)制為011，表示3；同時(shí)按下左鍵和滾輪，buttons的二進(jìn)制為101，表示5；同時(shí)按下右鍵和滾輪，buttons的二進(jìn)制為110，表示6
          <div id="box" style="height:30px;width:200px;background:pink;"></div><script>box.onmouseup=function(e){
          e = e || event;
          box.innerHTML = 'button:' + e.button + ';buttons:' + e.buttons;
          }</script>
          但，IE8-瀏覽器的button屬性的值與標(biāo)準(zhǔn)的button屬性有很大差異
          0:表示沒有按下按鈕
          1:表示按下了左鍵
          2:表示按下了右鍵
          3:表示同時(shí)按下了左、右鍵
          4:表示按下了滾輪
          5:表示同時(shí)按下了左鍵和滾輪
          6:表示同時(shí)按下了右鍵和滾輪
          7:表示同時(shí)按下了左鍵、右鍵和滾輪
          兼容
          此時(shí)，無法使用能力檢測來確定差異，可以通過hasFeature()方法來檢測，關(guān)于hasFeature()方法的詳細(xì)信息移步至此
          var hasMouse = document.implementation.hasFeature('MouseEvents','2.0');//IE8-瀏覽器返回false,其他瀏覽器trueconsole.log(hasMouse);<div id="box" style="height:30px;width:200px;background:pink;"></div><script>box.onmouseup=function(e){
          e = e || event; var Compatiblebutton; //IE8-瀏覽器
          if(!document.implementation.hasFeature('MouseEvents','2.0')){ switch(e.button){ case 1:
          Compatiblebutton = 0; break; case 2:
          Compatiblebutton = 2; break;
          case 4:
          Compatiblebutton = 1; break;
          }
          }else{
          Compatiblebutton = e.button;
          }
          box.innerHTML = 'button:' + Compatiblebutton;
          }</script>
          滾輪事件
          對于滾輪事件，有類似的滾動(dòng)事件scroll，但是滾動(dòng)事件不兼容IE8-瀏覽器，詳細(xì)情況移步至此
          滾輪事件與滾動(dòng)事件不同，滾動(dòng)事件必須有滾動(dòng)條，才可以實(shí)現(xiàn)。而滾動(dòng)事件是滾動(dòng)鼠標(biāo)滾輪觸發(fā)的事件，與是否有滾動(dòng)條無關(guān)
          滾輪事件中有一個(gè)wheelDelta屬性，當(dāng)用戶向前滾動(dòng)鼠標(biāo)滾輪時(shí)，wheelDelta是120的倍數(shù)；當(dāng)用戶向后滾動(dòng)鼠標(biāo)滾輪時(shí)，wheelDelta是-120的倍數(shù)
          <div id="box" style="height:100px;width:200px;background:pink;"></div><script>box.onmousewheel=function(e){
          e = e || event;
          box.innerHTML = e.wheelDelta; if(e.wheelDelta >0){
          box.style.backgroundColor = 'lightblue';
          }else{
          box.style.backgroundColor = 'lightgreen';
          }
          }</script>
          firefox瀏覽器不支持mousewheel事件，它支持DOMMouseScroll事件，而有關(guān)鼠標(biāo)滾輪的信息則保存在detail屬性中，當(dāng)向前滾動(dòng)鼠標(biāo)滾輪時(shí)，這個(gè)屬性的值是-3的倍數(shù)，當(dāng)向后滾動(dòng)鼠標(biāo)滾輪時(shí)，這個(gè)屬性的值是3的倍數(shù)
          [注意]該事件僅支持DOM2級事件處理程序的寫法
          <div id="box" style="height:100px;width:200px;background:pink;"></div><script>box.addEventListener('DOMMouseScroll',function(e){
          e = e || event;
          console.log(e)
          box.innerHTML = e.detail; if(e.detail >0){
          box.style.backgroundColor = 'lightblue';
          }else{
          box.style.backgroundColor = 'lightgreen';
          }
          })</script>
          兼容
          var handler = function(e){
          var getWheelDelta;
          e = e || event;
          if(e.wheelDelta){
          getWheelDelta = e.wheelDelta;
          }else{
          getWheelDelta = -e.detail * 40;
          }
          }
          移動(dòng)設(shè)備
          由于移動(dòng)設(shè)備沒有鼠標(biāo)，所以與電腦端有一些不同之處。移動(dòng)設(shè)備盡量使用移動(dòng)端事件，而不要使用鼠標(biāo)事件
          【1】不支持dblclick雙擊事件。在移動(dòng)設(shè)備中雙擊瀏覽器窗口會(huì)放大畫面
          【2】單擊元素會(huì)觸發(fā)mousemove事件
          【3】兩個(gè)手指放在屏幕上且頁面隨手指移動(dòng)而滾動(dòng)時(shí)會(huì)觸發(fā)mousewheel和scroll事件
          歡迎交流
                              	
          
	
	

          

          

 
          
        
        
		  
      
          
      
      
          
    
          
  
          

          



 


			
		





          
  
          
    
  
          

          

          
	
          
		
		
		
          
	
          


          
 

 







主站蜘蛛池模板：
色综合视频一区二区三区|
国产vr一区二区在线观看|
国产一区在线视频|
国产精品一区二区久久沈樵|
亚洲一区二区成人|
一区二区三区中文|
91香蕉福利一区二区三区|
亚洲爽爽一区二区三区|
国产精品久久久久一区二区|
亚洲国产欧美一区二区三区|
中文字幕亚洲一区二区va在线|
国产一区风间由美在线观看|
女人18毛片a级毛片一区二区|
国产在线精品一区二区在线观看|
国产vr一区二区在线观看|
无码人妻精品一区二区三区99不卡
|
亚洲一区二区影院|
国产一在线精品一区在线观看|
精品一区二区久久久久久久网精|
亚洲不卡av不卡一区二区|
三上悠亚国产精品一区|
亚洲一区爱区精品无码|
国产婷婷色一区二区三区|
无码少妇一区二区|
国产成人精品久久一区二区三区|
亚洲一区动漫卡通在线播放|
无码人妻精品一区二区蜜桃网站|
99热门精品一区二区三区无码|
精品福利一区二区三区免费视频
|
日本美女一区二区三区|
一区二区三区在线观看免费|
夜夜爽一区二区三区精品|
中文字幕在线观看一区二区
|
久久精品国产一区二区三区肥胖|
国产精品丝袜一区二区三区|
日本一区二区在线播放|
亚洲另类无码一区二区三区|
国产综合无码一区二区色蜜蜜|
人妻内射一区二区在线视频|
亚洲老妈激情一区二区三区|
老熟妇仑乱一区二区视頻|