jquery Document Fragmentation DocumentFragment

Source: Internet
Author: User
Tags add interface range
What is the document fragment?
Description of the reference standard, DocumentFragmentis a lightweight document object that can extract some of the document's trees or create a new document fragment, in other words, a document caching function.
What role does Createdocumentfragment have?Use the node method (such as: appendchild) to draw the page multiple times, each time you want to refresh the page. Efficiency is compromised, and using document_createdocumentfragment () creates a fragment of the document, attaches all the new nodes to it, and then adds the contents of the document fragment to the documents at once, which requires only one page refresh.
documentfragment TypeOf all node types, only DocumentFragment has no corresponding tag in the document. Dom prescribes that a document fragment (DocumentFragment) is a "lightweight" document that can contain and control nodes, but does not occupy additional resources as a complete document. The DocumentFragment node has the following characteristics: 1. The value of NodeType is 11 2. The value of NodeName is "#document-fragment" 3. The value of NodeValue is null 4. The value of parentnode is null 5. Child nodes can be Element, ProcessingInstruction, Comment, Text, cdatasection, or EntityReference Although the document fragment cannot be added directly to the document, it can be used as a "warehouse" To use, where you can save nodes that might be added to your document in the future. To create a document fragment, you can use the Document.createdocumentfragment () method, as follows: var fragment = Document.createdocumentfragment (); The document fragment inherits all of node's methods and is typically used to perform those DOM operations against the document. If you add a node in a document to a document fragment, the node is then visible from the document tree. New nodes added to the document fragment are also not part of the document tree. You can add content from a document fragment to a document by AppendChild () or insertbefore (). When you pass a document fragment as an argument to both methods, you are actually adding all the child nodes of the document fragment to the appropriate location, and the document fragment itself will never be called part of the document tree. createelement and CreatedocumentfragmentCreateElement is creating a new node, createdocumentfragment is creating a fragment of the document. The DocumentFragment interface represents a part (or a section) of a document. Rather, it represents one or more contiguous Document nodes and all their descendants nodes. The DocumentFragment node is not part of the document tree, and the inherited ParentNode property is always null. But it has a special behavior that makes it useful: when a request inserts a DocumentFragment node into the document tree, it does not insert the documentfragment itself, but all its descendant nodes. This makes documentfragment a useful placeholder for temporarily storing the nodes that were inserted into the document at once. It also facilitates the process of cutting, copying, and pasting documents, especially when used with the Range interface. You can create a new empty documentfragment node using the Document.createdocumentfragment () method. You can also use the Range.extractcontents () method or the Range.clonecontents () method to get a documentfragment node that contains fragments of an existing document. In addition, the elements created by createelement can use the elements created by innerhtml,createdocumentfragment to use innerHTML and do not achieve the desired effect of modifying the contents of the document, just as a property. The node types of the two are completely different, and the elements created by createdocumentfragment do not have corresponding tags in the document, so they can only be accessed in JS on the page.
CreateElement created elements can be repeated operations, added even if removed from the document is still owned by the document, you can continue to operate, but Createdocumentfragment created the element is one-time, add then can not operate, In the previous Dommanip method mentioned in the Inoclone multiple node operations need cloning, because of the characteristics of the document fragmentation, generally understood, we look at jquery for node operations, the enhanced version of the document fragment Buildfragment.

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.