jquery Core Buildfragment

Source: Internet
Author: User
Tags object resource string

Core Buildfragment

Dom native interfaces are simple and unitary, parameter types are determined, and not overloaded, and only one element is processed at a time. In the view of jquery completely opposite parameters are complex and diverse, interface overload is severe. If you pass more than one node element at a time, you must introduce document fragmentation in order to optimize processing. We know that using document fragmentation is nothing more than creating first: Fragment = Context.createdocumentfragment () and then put all the DOM nodes that need to be processed into AppendChild: Buildfragment for document fragmentation creation , you can see that the 2 parts have been cut: First look at the first part of the code to collect node elements:

  1. var $newdiv 1 = $ (' <div id= "Object1"/> '),
  2. Newdiv2 = document.createelement (' div '),
  3. Existingdiv1 = document.getElementById (' foo ');
  4. $ (' body '). Append ($newdiv 1, [Newdiv2, Existingdiv1, ' <td> resource net </td> ', ' text ', ' <script>alert (1) '])
This code contains six different types of parameters, basically covering all the buildfragment processing is actually very simple, we only need to decompose the different types of parameters, the indentation into the document fragment, of course, because the type of different ways of processing.
For example, a few common problems: IE on the string for trimleft operations, the rest is user input processing, many tags can not be separate as the child elements of Div, TD, Th, TR, TFOOT, tbody, etc., need to add and tail: <td> Resource Network </td > jquery is transformed by Wrapmap, otherwise some will be interpreted as plain text: "<table><tbody><tr><td> the &LT;/TD&GT;&LT;/TR Resource Network ></tbody></table> "
We refer to the code on the right, the whole process is as follows: Decomposition type, jquery object, node object, text, string, script introduced nodes collection of various types of decomposition data for HTML nodes, compatible with IE processing, first filter the blank, and then fill the tr,td and so on to create document fragments div include node , the HTML structure is given to innerHTML to take out the created node, Jquery.merge (nodes, Tmp.childnodes), because the DIV has been wrapped

Related Article

Cloud Intelligence Leading the Digital Future

Alibaba Cloud ACtivate Online Conference, Nov. 20th & 21st, 2019 (UTC+08)

Register Now >

11.11 Big Sale for Cloud

Get Unbeatable Offers with up to 90% Off,Oct.24-Nov.13 (UTC+8)

Get It Now >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

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.