Grab Html Tags from HTML Variable using get() jquery
First: I am new to javascript so please forgive me if my syntax is novice.
I have been trying to get data in HTML tags using get() in jquery. But no matter how many different variations I try, it just won't work. Can someone please show me what I am doing wrong?
Below is the javascript I am using.
$.get('load.html', function(raw){
var bodyHtml = $(raw).filter('body').html();
var divHtml = $(raw).filter('div').html();
var title = $(raw).filter('title').text();
var tag = $(raw).filter('tag').html();
$('#body').html(bodyHtml);
$('#tag').html(tag);
$('#title').html(title);
$('#result').html(divHtml);
$('#raw').html(raw);
});
Below is the html on the load.html page.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>title load.html</title>
</head>
<body>
<div>div 1<tag>divtag</tag></div>
<tag>tag</tag>
</body>
</html>
This is the results once page has run. index.html
<html><head>
<title>index.html</title>
<script type="text/javascript" src="js/jquery/jquery-1.5.1.min.js"></script>
<script type="text/javascript">
$.开发者_如何学Pythonget('load.html', function(raw){
var bodyHtml = $(raw).filter('body').html();
var divHtml = $(raw).filter('div').html();
var title = $(raw).filter('title').text();
var tag = $(raw).filter('tag').html();
$('#body').html(bodyHtml);
$('#tag').html(tag);
$('#title').html(title);
$('#result').html(divHtml);
$('#raw').html(raw);
});
</script>
</head>
<body>
<div id="title">title load.html</div>
<div id="body"></div>
<div id="result">div 1<tag>divtag</tag></div>
<div id="tag">tag</div>
<div id="raw">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>title load.html</title>
<div>div 1<tag>divtag</tag></div>
<tag>tag</tag>
</div>
</body></html>
One thing to note. It looks like the isn't sent back from jquery. Also if there is multiple on the page. Shouldn't this script make it a array (example being )
You need to wrap your $.get()
call inside a "document ready" handler - at the moment the DOM elements you're trying to manipulate don't exist at the point you're making the call:
$(document).ready(function() {
// your code here
});
Here is the results. I thought it was the html() tag stripping the body, and head tags out of the variable. When I would do a alert(raw) from a url it would show the full html page. But then when I try and modify that variable, the tags () would disappear. I then thought it was jquery. So I tried a regular expression. Sure enough I got the same exact results. So I am only able to retrieve tags like title, divs, but not the body.
$(document).ready(function() {
$.get('load.html', function(raw){
var matches = raw.match(/<title\b[^>]*>(.*?)<\/title>/gi);
//var matches = matches[0].replace(/(<\/?[^>]+>)/gi, ''); // Strip HTML tags?
alert(matches);
}, "html");
});
精彩评论