What should I do if jquery is not compatible with IE8 browser?

The jquery compatibility does not support the ie8 browser solution: 1. Use the statement [] can be used in Perform some compatible operations in IE8 mode; 2. Add a custom forEach method for browsers that do not support forEach.

The operating environment of this tutorial: windows7 system, jquery3.2.1 version, DELL G3 computer.

Recommended: jquery video tutorial

The solution to jquery compatibility that does not support ie8 browsers:

1 , IE8 does not support the jQuery version solution

Load the corresponding version of jQuery by determining the version of the IE browser

Use the statement Some compatible operations can be performed in IE8 mode. The code is as follows:

<script type="text/javascript" src="<%=path%>/js/jquery-3.1.1.min.js"></script>
<!--[if IE 8]>
<script type="text/javascript" src="<%=path%>/js/jquery-1.9.1.min.js"></script>
<![endif]-->

In this way, when switching to IE8, the lower version of jQuery will overwrite the higher version of jQuery. If you need to adjust the style of some elements under IE8, it is best to place the JS code at the bottom of the page (and pay attention to whether there are inline styles), otherwise the styles set for some dynamically loaded content may not take effect.

2. IE8 does not support forEach solution

Add a custom forEach method for browsers that do not support forEach

The code is as follows:

if (typeof Array.prototype.forEach != 'function') {
    Array.prototype.forEach = function (callback) {
        for (var i = 0; i < this.length; i++) {
            callback.apply(this, [this[i], i, this]);
        }
    };
}

If it is an imported jQuery plug-in, you can put this code at the beginning of the plug-in content, so that no error will be reported when the forEach method is executed under IE8.

3. IE8 does not support map solution

Add custom forEach method

if (!Array.prototype.map) {
    Array.prototype.map = function(callback, thisArg) {
        var T, A, k;
        if (this == null) {
            throw new TypeError(" this is null or not defined");
        }
        // 1. Let O be the result of calling ToObject passing the |this| value as the argument.
        var O = Object(this);
        // 2. Let lenValue be the result of calling the Get internal method of O with the argument "length".
        // 3. Let len be ToUint32(lenValue).
        var len = O.length >>> 0;
        // 4. If IsCallable(callback) is false, throw a TypeError exception.
        // See: http://es5.github.com/#x9.11
        if (typeof callback !== "function") {
            throw new TypeError(callback + " is not a function");
        }
        // 5. If thisArg was supplied, let T be thisArg; else let T be undefined.
        if (thisArg) {
            T = thisArg;
        }
        // 6. Let A be a new array created as if by the expression new Array(len) where Array is
        // the standard built-in constructor with that name and len is the value of len.
        A = new Array(len);
        // 7. Let k be 0
        k = 0;
        // 8. Repeat, while k < len
        while(k < len) {
            var kValue, mappedValue;
            // a. Let Pk be ToString(k).
            //   This is implicit for LHS operands of the in operator
            // b. Let kPresent be the result of calling the HasProperty internal method of O with argument Pk.
            //   This step can be combined with c
            // c. If kPresent is true, then
            if (k in O) {
                // i. Let kValue be the result of calling the Get internal method of O with argument Pk.
                kValue = O[ k ];
                // ii. Let mappedValue be the result of calling the Call internal method of callback
                // with T as the this value and argument list containing kValue, k, and O.
                mappedValue = callback.call(T, kValue, k, O);
                // iii. Call the DefineOwnProperty internal method of A with arguments
                // Pk, Property Descriptor {Value: mappedValue, : true, Enumerable: true, Configurable: true},
                // and false.
                // In browsers that support Object.defineProperty, use the following:
                // Object.defineProperty(A, Pk, { value: mappedValue, writable: true, enumerable: true, configurable: true });
                // For best browser support, use the following:
                A[ k ] = mappedValue;
            }
            // d. Increase k by 1.
            k++;
        }
        // 9. return A
        return A;
    };
}

Related free learning recommendations:js video tutorial

The above is the detailed content of What should I do if jquery is not compatible with IE8 browser?. For more information, please follow other related articles on the PHP Chinese website!