Jquery Bug: jquery selector failure bug when the form contains input whose name is nodeType

I. bug discovery process

Today, when my colleague used my JavaScript form verification control, he found that when the form contains an input whose name is nodeType, the verification component would not work well. After a simple test, we found that $ ('form: input') could not select an element at all. I thought this was definitely a jquery bug.

Ii. bug Analysis

Then I opened the jquery source code and looked at it. I found that many of the Code in it is related to the nodeType attribute. How can I start this? This is nearly 10 thousand lines of code. Tears rush...

Inadvertently found such a line of comment in the code.

/*!* Sizzle CSS Selector Engine v1.9.4-pre* http://sizzlejs.com/** Copyright 2013 jQuery Foundation, Inc. and other contributors* Released under the MIT license* http://jquery.org/license** Date: 2013-05-27*/

　　

I thought that this problem is definitely the problem of css selector. It must be correct from here.

Then download sizzle. js from this address and find that this selector problem exists here. Xi. Then a little debugging finds the root cause of the problem.

What are the problems found?

If there is an input such as nodeType in the form, $ ('form') [0]. nodeType is not equal to 1, and its value is the input object.

3. fix bugs

Last modified code

Set

if ( elem.nodeType === 1 || checkNonElements ) {

Change

if ( (elem.nodeType === 1 || typeof elem.nodeType != "number") || checkNonElements ) {

(Three items in total)

After modification, we found that Sizzle ('form: input') is easy to use and $ ('form: input') in jquery is easy to use.

However, it is sad that my verification control is still not easy to use. Test results show that $ ('form'). find (': input') is not easy to use. Do I still have to debug the jquery source code? It was disheartened. I really want to give up. The joy and sense of accomplishment just now are gone ......

On the Internet, I randomly checked some information and analyzed some of the jquery source code. I found that the problem still exists in Sizzle and found that the find method should be Sizzle (': input ', Sizzle ('form') [0]). The test shows that the modified Code still cannot use this expression. (No find method in Sizzle)

Then the test is performed based on this expression and another code is modified:

Set

if ( (nodeType = context.nodeType) !== 1 && nodeType !== 9 ) {

Replace:

if ( (nodeType = context.nodeType) !== 1 && nodeType !== 9 && (typeof context.nodeType === "number")) {

Success.

The above Modification Scheme is only for personal modification comments, and it cannot be guaranteed that it will not cause other bugs. If you really want to use it, please be careful.

 

This article is original by the author. For more information, see the source and share my happiness with you.
Http://www.cnblogs.com/weirhp