How to Convert html strings into jquerydom objects in javascript _ javascript skills

Recently, the project needs to develop an application related to Baidu Map. you need to extract the desired elements and attribute information from the hardcoded html string, because dom objects or jq objects are used to operate element nodes and attributes in js or jq. The following describes how to convert html strings to jquerydom objects in javascript. For more information, see The original html string is as follows:

var text="
"        + ""        + "
";

1. the following uses the Jquery library to convert text string variables into Jquery objects.

The Jquery code is as follows:

　　alert($(text).html());

$ (Text) converts the text string to a Jquery object, and finally outputs the html content of the Jquery object in the form of a string. The result is as follows:

The $ (text) Jquery object represents the outermost html element p.

2. convert Jquery objects and DOM objects.

The code is as follows:

Var element = $ (text). get (0) // element is a dom object var jqueryobj = $ (element); // jqueryobj is a Jquery object.

Note: differences between DOM objects and Jquery objects

In my understanding, Jquery objects and DOM objects are encapsulated html elements. they can operate on html element nodes to facilitate programming, but some methods between them cannot be shared, for example, the html () method of the Jquery object cannot be used by the DOM object. the GetElementById () method of the DOM object cannot be used by the Jquery object. Therefore, they can be converted when necessary.

3. use JavaScript code to convert text string variables into DOM objects.

The js code is as follows:

/* Convert string to dom object */function loadXMLString (txt) {try // Internet Explorer {xmlDoc = new ActiveXObject ("Microsoft. XMLDOM "); xmlDoc. async = "false"; xmlDoc. loadXML (txt); // alert ('ie'); return (xmlDoc);} catch (e) {try // Firefox, Mozilla, Opera, etc. {parser = new DOMParser (); xmlDoc = parser. parseFromString (txt, "text/xml"); // alert ('fmo'); return (xmlDoc);} catch (e) {alert (e. message) }} return (null );}

The js code converts the text string into a DOM object, which is related to the browser ...... Separate write.

In this way, html strings are converted to Jquery objects and DOM objects.

Introduction to mutual conversion between jQuery objects and dom objects

When I first started learning jQuery, I may be confused about jQuery objects and DOM objects. As for DOM objects, we don't have much to explain, and we have too many contacts. next we will focus on jQuery and the conversion between them.

What is a jQuery object?

--- It is the object generated after DOM object is packaged using jQuery. JQuery objects are unique to jQuery and can be used in jQuery.

For example:

$ ("# Test" example .html () means to get the html code in the element with the ID of test. Here, html () is the method in jQuery.

This code is equivalent to implementing code with DOM:

Document. getElementById ("id"). innerHTML;
Although jQuery objects are generated after packaging DOM objects, jQuery cannot use any methods of DOM objects. Similarly, DOM objects cannot use methods in jQuery. if they are used improperly, an error is returned. For example, $ ("# test"). innerHTML and document. getElementById ("id" ).html () are all incorrect.

Note that the DOM object obtained by using the # id as the selector is the DOM object obtained by The jQuery object and document. getElementById ("id"). These two are not equivalent. See the conversion between the two.

Since jQuery is different but also related, jQuery objects and DOM objects can also be converted to each other. Before the conversion, we first give a convention: if a jQuery object is obtained, we add $ Before the variable, for example, var $ variab = jQuery object; if the DOM object is obtained, it is the same as the common convention: var variab = DOM object. this convention is only convenient for explanation and difference. it is not specified in actual use.

Convert a jQuery object to a DOM object:

Two conversion methods are used to convert a jQuery object to a DOM object: [index] and. get (index );

(1) The jQuery object is a data object. you can use the [index] method to obtain the corresponding DOM object.

For example:

Var $ v = $ ("# v"); // jQuery object var v = $ v [0]; // DOM object alert (v. checked) // check whether the checkbox is selected

(2) jQuery provides the. get (index) method to obtain the corresponding DOM object.

For example:

Var $ v = $ ("# v"); // jQuery object var v = $ v. get (0); // DOM object alert (v. checked) // check whether the checkbox is selected

Convert a DOM object to a jQuery object:

For a DOM object, you only need to wrap the DOM object with $ () to obtain a jQuery object. $ (DOM object)

For example:

Var v = document. getElementById ("v"); // DOM object var $ v =$ (v); // jQuery object

After conversion, you can use the jQuery method at will.

Using the above method, you can convert jQuery objects and DOM objects to each other. Note that only DOM objects can use methods in DOM. jQuery objects cannot use methods in DOM.