新人第一次提问,有没有大神知道如何用 js 的解析文本形式的 html 文件啊?

2016-06-01 10:37:21 +08:00
 xudd
因为硬件条件限制,无法用 java 在后台解析获取的网页,也不能用 iframe 在页面嵌入 ajax 获取到的 html 文件,只能用 js 的正则表达式等去解析 html 文件。求大神指条明路,拜托拜托
3514 次点击
所在节点    程序员
24 条回复
will0404
2016-06-01 10:44:00 +08:00
浏览器端不清楚 ,如果是 node 环境可以用 cheerio 这个库
xudd
2016-06-01 10:45:42 +08:00
@will0404 恩,能用 node 的确就简单了,可是我们的机顶盒浏览器只有 100M 内存。。。。
zenxds
2016-06-01 10:53:53 +08:00
用 createFragment 不就可以了
imn1
2016-06-01 11:00:56 +08:00
导入到不可视元素就可以 DOM 了
loading
2016-06-01 11:04:35 +08:00
没有用过 js 吗?
如果是固定的 html ,用 jQuery 就能处理了。
zhouyg
2016-06-01 12:17:41 +08:00
可以用 jquery 中带的那个搜索器
Arrowing
2016-06-01 12:23:57 +08:00
jquery 就可以吧
$('html')
$('<html></html>') //文本内容
xudd
2016-06-01 14:40:12 +08:00
@zenxds 谢谢,我不是要获取创建元素,是要解析 html 文件中元素的内容,获取图片地址,标题和描述等
xudd
2016-06-01 14:40:40 +08:00
@imn1 类似于 iframe 吗?
bigcoon
2016-06-01 14:41:19 +08:00
正则
xudd
2016-06-01 14:52:35 +08:00
@zhouyg 搜索器是什么?
xudd
2016-06-01 14:53:40 +08:00
@bigcoon 现在就是用的正则,可是不知道为什么会卡死浏览器,我的代码是这样的
function doAjaxCall(the_request){
$.ajax({
type:"get",
url:the_request,
dataType:"html",
success:function(result){
var ol = result+"";
var regTitle = /shelf-title-table[^.]*(\s*)[^.]*(\n)*(\r)*(.*)[^.]*(\?)*?menu-container/gm;
var mTitle,proName;
var reg = /yt-shelf-grid-item[^.]*(\s*)[^.]*(\n)*(\r)*(.*)[^.]*(\?)*?yt-shelf-grid-item/gm;
var m,i=0;
$("#program").empty();
while(i<7){
mTitle = regTitle.exec(ol)
//alert(regTitle.lastIndex)
proName = mTitle[0].match(/branded-page-module-title-text(\s*?)(.*?)<\/span>/)[0].replace("branded-page-module-title-text\">","").replace("</span>","");
var str = '<div class="nav"><ul><li><span>'+proName+'</span></li></ul></div>'+
'<div class="zd_con" id="zdCon'+i+'"><ul id="programList'+i+'">';
var j = 0;
strVertArr[i] = new Array();
reg.lastIndex = regTitle.lastIndex;
while(j<5){
m = reg.exec(ol);
var imgSrcURL = m[0].match(/src=".*?"/)[0].replace("src=\"","").replace("\"","");
var aHref = m[0].match(/href="\S*?"/)[0].replace("href=\"","http://www.youtube.com").replace("\"","");
var name = '';//m[0].match(/yt-lockup-title[^.]*?(\s*?)(.*?)<\/h3>/)[0].match(/title="\S*?"/)[0].replace("title=\"","").replace("\"","");
var description = '';//m[0].match(/<li>[^.]*(.*)(\s*)(.*)[^.]*<\/li>/)[0].replace("<li>","").replace("</li><li>","-").replace("</li>","");
if(j<5){
if(j==0)
str += '<li><a id="a'+i+j+'" onkeydown="changeHome(event,\'\')" onfocus="return false;" ';
else
str += '<li><a id="a'+i+j+'" onkeydown="changeLoc(event,\'\')" onfocus="return false;" ';
str += ' href="javascript:goToPlay(\'' + aHref + '\');" class="scale-item movies big-cover">';
str += '<img class="big-img" src="'+imgSrcURL+'" />';
str += '<span class="wz"><h3>'+name+'</h3><p>' + description +'</p></span></a></li>';
}
strVertArr[i][j] = new AdItem(name,imgSrcURL,aHref,description);
j++;
//ol.replace(m[0]+"","");
}
//alert(reg.lastIndex)
str += '</ul></div>';
strArray[i] = str;
i++;
$("#program").append(str);
//ol.replace(mTitle[0]+"","");
}
$("#program").css("margin-bottom","20px");
$(".body-right").css("margin-top","0px");
}
});
}
xudd
2016-06-01 14:54:32 +08:00
@Arrowing 可以给个简单的例子吗?
imn1
2016-06-01 14:59:38 +08:00
pimin
2016-06-01 15:08:40 +08:00
楼主这个 js 是运行在盒子的浏览器,还是 web 端的浏览器啊?
如果是运行在盒子,不如中间加一层代理,就是做 API 返回 JSON,这样处理就简单得多,更省资源.
盒子性能优先,正则处理 HTML 开销并不比后台处理小.
loginv2
2016-06-01 15:14:03 +08:00
@xudd 不清楚问题所在 但是可以肯定的是 把+=这种拼接字符串 改成数组 push 每一行内容 最后 join 起来 是一种优化 字符串拼的越多的时候 效果越明显
hronro
2016-06-01 15:28:30 +08:00
有个思路,就是把文本形式的 html ,直接插入到一个 display:none 的 div 中去,这样相当于可以通过浏览器原生的方法来解析 HTML ,而不用自己手动写 JS 来解析。当然实际性能如何,还需要具体测试
Arrowing
2016-06-01 17:09:57 +08:00
@xudd 正则性能一般写的性能都很差,好的正则和不好的正则差别十分大,一般不建议这样使用。
例子(不能跨域):
$.ajax({
type:"get",
url: 'https://cn.v2ex.com/t/282675',
dataType:"html",
success:function(result){

var htmlNode = $(result);
console.log(htmlNode);

}});
iyangyuan
2016-06-01 17:44:57 +08:00
innerHTML
ChiChou
2016-06-01 18:07:47 +08:00

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/282675

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX