Code _ javascript

Source: Internet
Author: User
IE has many easy-to-use methods and is later copied by other browsers, such as the contains method. If element A contains Element B, true is returned; otherwise, false is returned. The only thing that does not support this method is the opposite of IE firefox. To be compatible with IE and FF, we have to use the following methods:

<! Doctype html> <title> dom contains METHOD by SITU zhengmei </title> <meta charset = "UTF-8"/> <meta name = "keywords" content = "dom contains METHOD by SITU zhengmei "/> <meta name =" description "content =" dom contains METHOD by SITU zhengmei "/> <script type =" text/javascript "> if (!! Window. find) {HTMLElement. prototype. contains = function (B) {return this. compareDocumentPosition (B)-19> 0} window. onload = function () {var A = document. getElementById ('parent'), B = document. getElementById ('child '); alert (. contains (B); alert (B. contains ());} script contains method <p id = "parent"> <p> <strong id = "child"> contains method </strong> </p>
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]


However, Firefox supports the compareDocumentPosition () method, which is developed by W3C and supported by standard browsers. However, it is not practical, so no one can use it and cannot be promoted. Its usage is similar to that of contains, but the returned value is not a Boolean value, but a very strange value. It is calculated in the following way:
Bits Number Meaning
000000 0 Element consistency
000001 1 Node in different documents (or one out of the document)
000010 2 Node B is before node.
000100 4 Node A is before Node B.
001000 8 Node B contains node
010000 16 Node A contains Node B
100000 32 Private Use of browsers

<! Doctype html> <title> dom contains METHOD by SITU zhengmei </title> <meta charset = "UTF-8"/> <meta name = "keywords" content = "dom contains METHOD by SITU <meta name = "description" content = "dom contains METHOD by SITU zhengmei"/> <script type = "text/javascript"> window. onload = function () {var A = document. getElementById ('parent'), B = document. getElementById ('child '); alert (. compareDocumentPosition (B); // B is not connected to A, B is behind A, B is contained by A 4 + 16 = 20 alert (B. compareDocumentPosition (A); // A and B are not connected, A is in front of B, A contains B 2 + 8 = 10} compareDocumentPosition method of script <p id = "parent"> <p> <strong id = "child"> This example is in the standard browser. run. </Strong> </p>
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]



PPK provides the following solutions.

The Code is as follows:


If (window. Node & Node. prototype &&! Node. prototype. contains ){
Node. prototype. contains = function (arg ){
Return !! (This. compareDocumentPosition (arg) & 16)
}
}


I made a shorter one:

The Code is as follows:


If (!! Window. find ){
HTMLElement. prototype. contains = function (B ){
Return this. compareDocumentPosition (B)-19> 0
}
}


<! Doctype html> <title> dom contains METHOD by SITU zhengmei </title> <meta charset = "UTF-8"/> <meta name = "keywords" content = "dom contains METHOD by SITU zhengmei "/> <meta name =" description "content =" dom contains METHOD by SITU zhengmei "/> <script type =" text/javascript "> if (!! Window. find) {HTMLElement. prototype. contains = function (B) {return this. compareDocumentPosition (B)-19> 0} window. onload = function () {var A = document. getElementById ('parent'), B = document. getElementById ('child '); alert (. contains (B); alert (B. contains ());} script contains method <p id = "parent"> <p> <strong id = "child"> contains method </strong> </p>
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]


The Code is as follows:


// 2011.9.24 by SITU zhengmei
Var contains = function (root, el ){
If (root. compareDocumentPosition)
Return root = el | !! (Root. compareDocumentPosition (el) & 16 );
If (root. contains & amp; el. nodeType = 1 ){
Return root. contains (el) & root! = El;
}
While (el = el. parentNode ))
If (el = root) return true;
Return false;
}

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.