国产精品国产午夜免费福利看,欧美性猛交xxxx富婆,做受视频国产免费观看

js二種方法，給html元素對象添加自定義的函數(shù)比較

時間：2018/8/24 21:21:03 作者：tsccwl 人氣：標簽：自定義的函數(shù) html

　　html5代碼：
<!doctype html>
<html lang="en">
<!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>
<meta charset="UTF-8">
<title>轉賬二維碼支付</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="initial-scale=1, maximum-scale=1">
<link rel="shortcut icon" href="/favicon.ico">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
</head>
<style>
html,body{ background: #fff;}
*{margin:0px; padding: 0px; list-style: none;font-family:"Microsoft YaHei"}
.tabs{ margin-top:5px;text-align:center;}
.tabs a{ padding:10px; cursor:pointer;}
.tabs .cur{ color:#339966;}
</style>
<body>
<div class="STYLE3">
  <center><h2>轉賬二維碼支付</h2></center>
</div>
  <div class="tabs" id="tabs">
     <a class="cur t">QQ錢包</a>
<a class="t">微信錢包</a>
<a class="t">支付寶</a>
  </div>
<div class="conetnt" style="text-align: center; margin-top:5px;">
<div style="text-align: center;" class="QRcode tabslist" id="tabslist">
   <img src="images/qianbao.png" alt="QQ錢包" width="800" height="770" style="" class="img" />
   <img src="images/weixin.png"  alt="微信轉賬"  width="800" height="770"  style="display:none;" class="img" />
   <img src="images/zhifubao.png" alt="支付寶" width="800" height="770" style="display:none;" class="img" />
</div>
</div>
</body>
傳統(tǒng)方式，是直接寫個函數(shù)一個參數(shù)為對象，代碼如下：
<script>
function getChilds(parent,clas){//獲取子元素
   var objs=new Array();
   if(parent){
       var childs=new Array();
  if(typeof(clas)!="undefined"){
  if(clas.indexOf(".")!=-1){
  childs=parent.getElementsByTagName("*");
  var clas1=clas.replace(".","");
  for(var i=0;i<childs.length;i++){
var obj=childs[i];
if(typeof(obj.className)!="undefined"){
var arr=obj.className.split(" ");
for(var j=0;j<arr.length;j++){
if(arr[j]==clas1){//如存在class
objs.push(obj);
break;
}
}
}
  }
  }else{
  objs=parent.getElementsByTagName(clas);//按標簽獲取
  }
  }else{
      childs=parent.childNodes;
  for(var i=0;i<childs.length;i++){
var obj=childs[i];
if(obj.nodeName!="#text"){//排除空元素
    // console.log(i,obj);輸出來瀏覽器f12控制面板console面板來
objs.push(obj);
}
  }
  }
   };
   return objs;
}
function hasClass(obj,clas){
if(typeof(obj.className)!="undefined"){
     var arr=obj.className.split(" ");
for(var j=0;j<arr.length;j++){
     if(arr[j]==clas){
    return true;
break;
}
}
};
return false;
};
function removeClass(obj,clas){//移除樣式類
if(typeof(obj.className)!="undefined"){
     var newclass="";
     var arr=obj.className.split(" ");
for(var j=0;j<arr.length;j++){
     if(arr[j]!=clas){
   if(newclass!=""){
  newclass+=" "+arr[j];
}else{
newclass=arr[j];
}
}
};
obj.className=newclass;
}
};
function addClass(obj,clas){//添加樣式類
   if(typeof(obj.className)!="undefined"){
      if(!hasClass(obj,clas)){
    obj.className=obj.className+" "+clas;
}
   }else{
       obj.className=clas;
   }
}
</script>
<script>
var tablis=getChilds(document.getElementById("tabs"));//獲取切換按鈕元素對象集合
var tabimgs=getChilds(document.getElementById("tabslist"));//獲取切換顯示的元素對象集合
for(var i=0;i<tablis.length;i++){
     (function(y){
tablis[y].onclick=function(){
for(var i=0;i<tablis.length;i++){
    removeClass(tablis[i],"cur");
   if(typeof(tabimgs[i])!="undefined"){
   tabimgs[i].style.display="none";
}
}
addClass(tablis[y],"cur");
if(typeof(tabimgs[y])!="undefined"){
   tabimgs[y].style.display="";
}
}
})(i);
}
</script>

另一種則是給html 元素全局大類注冊自定義的函數(shù)，這樣子就可以直接.出來的，注意ie 6 ,ie 7需要做相應的兼容，代碼如下
<script>
//所有的html元素都是屬于Element類,所以給Element注冊我們自己定義的相關函數(shù)
//兼容性
if(window.HTMLElement){
   window.Element=window.HTMLElement;
}else if(window.Element){
   window.Element=window.Element;
}else{
     window.Element =function(){};
window.isie67=true;
// alert(window.Element.isie6());
}
Element.prototype.getChilds=function(clas){//按類名獲取子元素
   var objs=new Array();
   if(this){
       var childs=new Array();
  if(typeof(clas)!="undefined"){
  if(clas.indexOf(".")!=-1){
  childs=this.getElementsByTagName("*");
  var clas1=clas.replace(".","");
  for(var i=0;i<childs.length;i++){
var obj=childs[i];
if(typeof(obj.className)!="undefined"){
var arr=obj.className.split(" ");
for(var j=0;j<arr.length;j++){
if(arr[j]==clas1){//如存在class
objs.push(obj);
break;
}
}
}
  }
  }else{
   objs=this.getElementsByTagName(clas);//按標簽獲取
  }
  }else{
      childs=this.childNodes;
  for(var i=0;i<childs.length;i++){
var obj=childs[i];
if(obj.nodeName!="#text"){//排除空元素
   // console.log(i,obj);輸出來瀏覽器f12控制面板console面板來
objs.push(obj);
}
  }
  }
   }
  if(typeof(window.isie67)!="undefined"){//兼容處理ie 6 ie 7 把我們自定義的屬性方法給注冊一下
  for(var k in  objs){
  for(var key in  window.Element.prototype){
  objs[k][key] =  window.Element.prototype[key];
  }
}
  }
   return objs;
}
Element.prototype.removeClass=function(clas){//移除樣式類
if(typeof(this.className)!="undefined"){
     var newclass="";
     var arr=this.className.split(" ");
for(var j=0;j<arr.length;j++){
     if(arr[j]!=clas){
   if(newclass!=""){
  newclass+=" "+arr[j];
}else{
newclass=arr[j];
}
}
}
this.className=newclass
}
}
Element.prototype.hasClass=function(clas){//判斷樣式類是否存在
if(typeof(this.className)!="undefined"){
     var arr=this.className.split(" ");
for(var j=0;j<arr.length;j++){
     if(arr[j]==clas){
    return true;
break;
}
}
}
return false;
}
Element.prototype.addClass=function(clas){ //添加樣式類
   if(typeof(this.className)!="undefined"){
      if(!this.hasClass(clas)){
    this.className=this.className+" "+clas;
}
   }else{
         this.className=clas;
   }
}

if(typeof(window.isie67)!="undefined"){//兼容處理ie 6 ie 7 不然無法直接調用 .addClass  .hasClass  .removeClass
   //解決辦法來自:https://www.e-learn.cn/content/wangluowenzhang/205066
   //其它：https://www.cnblogs.com/dojo-lzz/p/3731245.html
var __createElement = document.createElement;
document.createElement = function(tagName)
{
var element = __createElement(tagName);
for(var key in  window.Element.prototype)
element[key] =  window.Element.prototype[key];
return element;
}
var __getElementById = document.getElementById
document.getElementById = function(id)
{
var element = __getElementById(id);
for(var key in  window.Element.prototype)
element[key] =  window.Element.prototype[key];
return element;
}
var __getElementsByTagName = document.getElementsByTagName
document.getElementsByTagName = function(id)
{
var element = __getElementsByTagName(id);
for(var key in  window.Element.prototype)
element[key] =  window.Element.prototype[key];
return element;
}
}
var tablis=getChilds(document.getElementById("tabs"));
var tabimgs=getChilds(document.getElementById("tabslist"));
for(var i=0;i<tablis.length;i++){
     (function(y){
tablis[y].onclick=function(){
for(var i=0;i<tablis.length;i++){
     tablis[i].removeClass("cur");//區(qū)別就是可以這樣子直接調用
   if(typeof(tabimgs[i])!="undefined"){
          tabimgs[i].style.display="none";
}
}
tablis[i].addClass("cur");
if(typeof(tabimgs[y])!="undefined"){
   tabimgs[y].style.display="";
}
}
})(i);
}
</script>

上一篇：唐山企業(yè)網(wǎng)站建設服務器為什么選擇云服務器
下一篇：什么都沒有錯，程序報錯的,asp bug太多;錯誤 '800a0401'語句未結束,多加()則正常

本站首頁

關于我們

新聞中心

網(wǎng)站報價

成功案例

400電話

聯(lián)系方式