JQuery | parseHTML() method
Last Updated :
27 Apr, 2020
Improve
This parseHTML() Method in jQuery is used to parses a string into an array of DOM nodes.
Syntax:
jQuery.parseHTML(data [, context ] [, keepScripts ])Parameters: The parseXML() method accepts three parameter that is mentioned above and described below:
- data: This parameter is the HTML string to be parsed.
- context : This parameter is the document element to serve as the context in which the HTML fragment will be created.
- keepScripts : This parameter is the boolean indicating whether to include scripts passed in the HTML string.
-
Return Value: It returns the Array.
Example 1: In this example, the parseHTML() Method a string is parsed into an array of DOM nodes.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JQuery | parseHTML() method</title>
<script src="https://code.jquery.com/jquery-3.4.1.js"></script>
</head>
<body style="text-align:center;">
<h1 style="color: green">
GeeksForGeeks
</h1>
<h3>JQuery | parseHTML() method</h3>
<pre id="geek">
</pre>
<script>
var $geek = $( "#geek" ),
str = "A <b>computer science portal</b> for <b>geeks</b>",
html = jQuery.parseHTML( str ),
nodeNames = [];
$geek.append( html );
</script>
</body>
</html>
Example 2: In this example, the parseHTML() Method create an array of DOM nodes using an HTML string and insert it into a div.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JQuery | parseHTML() method</title>
<script src="https://code.jquery.com/jquery-3.4.1.js"></script>
</head>
<body style="text-align:center;">
<h1 style="color: green">
GeeksForGeeks
</h1>
<h3>JQuery | parseHTML() method</h3>
<div id="geek">
</div>
<script>
var $geek = $( "#geek" ),
str = "A <b>computer science portal</b> for <b>geeks</b>",
html = jQuery.parseHTML( str ),
nodeNames = [];
$geek.append( html );
$.each( html, function( i, el ) {
nodeNames[ i ] = "<li>" + el.nodeName + "</li>";
});
$geek.append( "<h3>Node Names:</h3>" );
$( "<b></b>" )
.append( nodeNames.join( "" ) )
.appendTo( $geek );
</script>
</body>
</html>
