一对常用且实用的原生JavaScript函数,推荐4个原生javascript常用的函数

推荐介绍4个原生javascript常用的函数

 这篇文章首要介绍了推荐4个原生javascript常用的函数,供给的朋友能够参照下

 

 

【一】增多监听事件

 

代码如下:

addHandler:function(node,type,fn){if(node.addEventListener){
node.addEventListener(type,fn,false); // false,设置为冒泡事件
}
else{
node.attachEvent(‘on’+type,function(){
fn.apply(node,arguments); //
attach伊芙nt方法中,this实际不是指向node,所以必要用apply()方法改换
});
}
一对常用且实用的原生JavaScript函数,推荐4个原生javascript常用的函数。}

 

【二】设置成分的体裁

 

代码如下:

setCss:function(node,val){ // val:{‘top’:’2px’,’font-size’:’12px’}
for(var v in val){
node.style.cssText += ‘;’+ v +’:’+val[v]; //使用
cssText就足以同不平日候设置几个属性,还会有个好处能够避免cssFloat,styleFloat的剖断
}
}

 

【三】获取CSS类名成分

 

代码如下:

//parent是可选参数,
getByClassName:function(className,parent){
var elem = [],
node = parent !=
undefined&&parent.nodeType==1?parent.getElementsByTagName(‘*’):document.getElementsByTagName(‘*’),
p = new RegExp(“(^|\\s)”+className+”(\\s|$)”);
for(var n=0,i=node.length;n<i;n++){
if(p.test(node[n].className)){
elem.push(node[n]);
}
}
return elem;
}

 

【四】删除CSS类名

 

代码如下:

removeClassName:function(node,className){
var par = new RegExp(className,’g’);
node.className = node.className.replace(par,”);
}

 

上述4个正是笔者整理的要命实用也须求日常应用到的原生js函数,推荐给小同伴们,希望对我们享有帮忙。

那篇文章重要介绍了推荐4个原生javascript常用的函数,须要的对象能够参照下
【一】增多监听事件 代码如下…

引入4个原生javascript常用的函数,javascript函数

【一】增添监听事件

复制代码 代码如下:

     addHandler:function(node,type,fn){if(node.addEventListener){
                node.add伊芙ntListener(type,fn,false);  //
false,设置为冒泡事件
            }
            else{
                node.attachEvent(‘on’+type,function(){
                    fn.apply(node,arguments); //
attachEvent方法中,this并不是指向node,所以要求用apply()方法改造
                });
            }
     }

 【二】设置成分的体裁

复制代码 代码如下:

       setCss:function(node,val){   //
val:{‘top’:’2px’,’font-size’:’12px’}
            for(var v in val){
                node.style.cssText += ‘;’+ v +’:’+val[v];  //使用
cssText就可以何况安装两性情情,还恐怕有个平价能够免止cssFloat,styleFloat的判别
            }
        }

【三】获取CSS类名元素

复制代码 代码如下:

 //parent是可选参数,
      getByClassName:function(className,parent){
            var elem = [],
                node = parent !=
undefined&&parent.nodeType==1?parent.getElementsByTagName(‘*’):document.getElementsByTagName(‘*’),
                p = new RegExp(“(^|\\s)”+className+”(\\s|$)”);
            for(var n=0,i=node.length;n<i;n++){
                if(p.test(node[一对常用且实用的原生JavaScript函数,推荐4个原生javascript常用的函数。n].className)){
                    elem.push(node[n]);
                }
            }
            return elem;
        }

 【四】删除CSS类名

复制代码 代码如下:

removeClassName:function(node,className){
    var par = new RegExp(className,’g’);
    node.className = node.className.replace(par,”);
}

上述4个正是本人整理的不得了实用也供给通常应用到的原生js函数,推荐给小同伙们,希望对大家有着帮忙。

【一】加多监听事件 复制代码 代码如下:
addHandler:function(node,type,fn){if(node.add伊芙ntListener){
nod…

css及html方面包车型大巴技能计算,点在此以前往: 前端开荒中部分常用技术总括,
你还足在此以前往兰芝博客, 查看由天猫商城UED整理的前端tips:
.

有关文章

连带寻找:

前日看什么

寻觅技艺库

回去首页

  • 推荐10本C#编制程序的极品书籍,
  • 推荐10本C#编制程序的一级书籍,
  • 推荐 10 个 ReactJS
    入门能源
  • 反手摸肚脐正是那般轻易瘦子健美消脂应用
  • 手提式有线电话机天猫店招图片分享
  • 即选取ADO.NET,也要轻量级实体映射,ado.net实

连带频道:
HTML/CSS  HTML5  Javascript  jQuery  AJax教程  前端代码  正则说明式  Flex教程  WEB前端教程  

  1. document.getElementById的简写:
    //www.jb51.net/article/24762.htm;
  2. getElementsByTagName的简写方式:
    //www.jb51.net/article/24026.htm;
  3. 原生JavaScript中获得成分索引的函数:
    //www.jb51.net/article/24763.htm;
  4. 代表window.onload,可一再调用的加载函数:

帮客批评

复制代码 代码如下:

function iLoad(func) {
var oLoad=window.onload;
if(typeof window.onload!=’function’){
window.onload=func;
}else{
window.onload=function(){
oLoad();
func();
}
}
}

  1. 赢得下三个因上秋点:

复制代码 代码如下:

function nextElem(node){
if(node.nodeType==1) return node;
if(node.nextSibling) return nextElem(node.nextSibling);
return null;
}

  1. 得到上多少个成分节点(此函数须调用第五条中的函数):

复制代码 代码如下:

function prevElem(node){
if(node.nodeType==1){
return node;
}else if(node.previousSibling){
return nextElem(node.previousSibling);
}else{
return null;
}
}

7.
原生JavaScript中有insertBefore方法,可惜却并未有insertAfter方法,怎么办?用如下函数完成:

复制代码 代码如下:

function insertAfter(newChild,refChild){
var parElem=refChild.parentNode;
if(parElem.lastChild==refChild){
refChild.appendChild(newChild);
}else{
parElem.insertBefore(newChild,refChild.nextSibling);
}
}

8.
为要素加多样式[铭记是加多不是替换,也正是jQuery中的addClass(value)]:

复制代码 代码如下:

function addClass(elem,value){
if(!elem.className){
elem.className=value;
}else{
var oValue=elem.className;
oValue+=” “;
oValue+=value;
elem.className=oValue;
}
}

  1. 皇家赌场手机版,得到成分的体制:

复制代码 代码如下:

function getStyle(id,stylename){
var elem=$(id);
var realStyle=null;
if(elem.currentStyle){
realStyle=elem.currentStyle[stylename];
}else if(window.getComputedStyle){
realStyle=window.getComputedStyle(elem,null)[stylename];
}
return realStyle;
}

  1. 匹配事件绑定:

复制代码 代码如下:

function addEventSamp(obj,evt,fn){
if (obj.addEventListener) {
obj.addEventListener(evt, fn, false);
}else if(obj.attachEvent){
obj.attachEvent(‘on’+evt,fn);
}
}

  1. 移除事件

复制代码 代码如下:

function removeEventSamp(obj,evt,fn){
if(obj.removeEventListener){
obj.removeEventListener(evt,fn,false);
}else if(obj.detachEvent){
obj.detachEvent(‘on’+evt,fn);
}
}

  1. 检验样式

复制代码 代码如下:

function hasClass(element, className){
var reg = new RegExp(‘(\\s|^)’ + className + ‘(\\s|$)’);
return element.className.match(reg);
}

  1. 去除样式

复制代码 代码如下:

function removeClass(element, className){
if (hasClass(element, className)) {
var reg = new RegExp(‘(\\s|^)’ + className + ‘(\\s|$)’);
element.className = element.className.replace(reg, ‘ ‘);
}
}

原著公布于Mr.Think的博客:

$()

复制代码 代码如下:

function $() {
var elements = [];
for (var i = 0; i < arguments.length; i++) {
var element = arguments[i];
if (typeof element == ‘string’)
element = document.getElementById(element);
if (arguments.length == 1)
return element;
elements.push(element);
}
return elements;
}

toggle()

用来呈现或躲藏一个DOM成分。

复制代码 代码如下:

function toggle(obj) {
var el = document.getElementById(obj);
el.style.display=(el.style.display !=”none”?”none”:””)
}

您也许感兴趣的稿子:

  • 部分常用的Javascript函数
  • 一再应用的javascript验证函数搜集
  • 常用简易JavaScript函数
  • 多少个常用的JavaScript字符串管理函数 –
    split()、join()、substring()和indexOf()
  • JavaScript 常用函数库详解
  • Jquery小编John Resig本人包装的javascript
    常用函数
  • JavaScript 常用函数
  • JavaScript 佚名函数(anonymous
    function)与闭包(closure)
  • javascript中动态函数用法实例分析
  • 跟自个儿学习javascript的函数和函数表明式
  • 跟本人就学javascript的函数调用和构造函数调用
  • 详解JavaScript中常用的函数类型

Leave a Comment.