jQuery:ajax处理html页面
源码:
$.ajax({ url: url, success: function (data) { var reg = /<body>[\s\S]*<\/body>/g; var html = reg.exec(data)[0]; html = $(html).filter(".body_main").html(); var title = $(html).filter("h2").html(); $("#body_main").find("h2").html(title); var content = $(html).filter(".main_content").html(); $(content).prependTo("#dvFirst"); $("#dvFirst>div:gt(4)").remove(); } });
注意点:
1.ajax传输过来的data中有换行符,正则表达式的时候需要注意,不能用.*,必须用[\s\S]*
2.在含有<html> </html>的字符串时,jquery不能够将字符串转化成Dom对象,需要去除html,body可以
3.在字符串转换成Dom对象后用find来查询时发现查不到,必须使用filter,具体的原因还不清楚。
find()获得当前元素匹配集合中每个元素的后代(子元素),选择性筛选的选择器(会在当前指定元素中查找符合条件的子元素,是对它的子集操作);
filter()则是在当前指定的元素集合中查找符合条件的元素,是对自身集合元素进行筛选。
例子:
body:
var str = "<body><div>hongda</div><div>hongda2</div><div>hongda3</div><div>hongda4</div></body>"; var html = $(str).find("div").first().html(); console.log(html); //null
var str = "<body><div>hongda</div><div>hongda2</div><div>hongda3</div><div>hongda4</div></body>"; var html = $(str).filter("div").first().html(); console.log(html); //hongda
div:
var str = "<div><div>hongda</div><div>hongda2</div><div>hongda3</div><div>hongda4</div></div>"; var html = $(str).find("div").first().html(); console.log(html); //hongda
var str = "<div><div>hongda</div><div>hongda2</div><div>hongda3</div><div>hongda4</div></div>"; var html = $(str).filter("div").first().html(); console.log(html); //<div>hongda</div><div>hongda2</div><div>hongda3</div><div>hongda4</div>