美文网首页
javascript兼容性解决方案-3

javascript兼容性解决方案-3

作者: 王饱饱 | 来源:发表于2017-06-26 22:09 被阅读0次

    Ba la la la ~ 读者朋友,你们好啊,又到了冷锋时间,话不多说,发车!


    二十五、getElementsByClassName

    var getElementsByClassName = function (searchClass, node,tag) {

    if(document.getElementsByClassName){

    var nodes = (node || document).getElementsByClassName(searchClass),result = [];

    for(var i=0 ;node = nodes[i++];){

    if(tag !== "*" && node.tagName === tag.toUpperCase()){

    result.push(node)

    }else{

    result.push(node)

    }

    }

    return result

    }else{

    node = node || document;

    tag = tag || "*";

    var classes = searchClass.split(" "),

    elements = (tag === "*" && node.all)? node.all : >node.getElementsByTagName(tag),

    patterns = [],

    current,

    match;

    var i = classes.length;

    while(--i >= 0){

    patterns.push(new RegExp("(^|\s)" + classes[i] + "(\s|$)"));

    }

    var j = elements.length;

    while(--j >= 0){

    current = elements[j];

    match = false;

    for(var k=0, kl=patterns.length; k<kl; k++){

    match = patterns[k].test(current.className);

    if (!match) break;

    }

    if (match) result.push(current);

    }

    return result;

    }

    }

    二十六、oninput,onchange,onpropertychange

    oninput -- IE9以上 实时触发,js改变无效

    onchange --都支持,需要失去焦点时出发,js等改变无效

    onpropertychange -- IE专有,实时触发,js改变有效。

    onchange事件与onpropertychange事件的区别:

    onchange事件在内容改变(两次内容有可能还是相等的)且失去焦点时触发;
    onpropertychange事件却是实时触发,即每增加或删除一个字符就会触发,通过js
    改变也会触发该事件,但是该事件IE专有。

    oninput事件与onpropertychange事件的区别:
    oninput事件是IE之外的大多数浏览器支持的事件,在value
    改变时触发,实时的,即每增加或删除一个字符就会触发,然而通过js改变value时,却不会触发;onpropertychange事件是任何属性改变都会触发的,而oninput却只在value改变时触发,oninput要通过addEventListener()来注册,onpropertychange注册方式跟一般事件一样。(此处都是指在js中动态绑定事件,以实现内容与行为分离)

    oninput与onpropertychange失效的情况:
    (1)oninput事件:
    a).当脚本中改变value时,不会触发;
    b).从浏览器的自动下拉提示中选取时,不会触发。
    (2)onpropertychange事件:当input设置为disable=true后,
    onpropertychange不会触发。


    以上为个人意见,如有雷同,纯属巧合,欢迎大家多提意见!Bey 了 个 Bey ~

    相关文章

      网友评论

          本文标题:javascript兼容性解决方案-3

          本文链接:https://www.haomeiwen.com/subject/totscxtx.html