从其他网站更改页面

时间:2014-01-04 13:20:49

标签: javascript php jquery html

对于模糊的问题名称感到抱歉 - 不知道该怎么说。

我已经构建了一个PHP引擎来解析网页并提取电话号码,地址等。

客户将使用此功能只需输入新的联系人网址即可填充地址簿。

我遇到的问题是可用性:

目前,脚本只是将每个项目(固定电话号码,传真等)添加到不同的列表框中,并且用户选择了正确的项目 - 从可用性的角度来看,这是一项艰苦的工作(您如何知道哪个是正确的联系人)不看网站的号码)

所以我的问题(最后!)

如何实现

的功能

http://bartaz.github.io/sandbox.js/jquery.highlight.html

在其他网站上(我编写此功能没有问题)。

FOR CLARITY ** 我想在我的网站上显示某个elses网站(例如他们的联系页面)但是我想要突出显示我找到的项目(例如,在我的php脚本找到的电话号码周围添加标签)

我知道要显示不在您网域上的网站,我会使用iFrame - 但是因为我需要更改网页内容,所以这是无用的。

我还考虑编写一个可以在该页面上运行的书签 - 但这意味着在javascript中重写我的解析引擎并公开我的一些技巧以使其准确。

所以我不得不通过cURL拉页面然后尝试匹配具有相对URL的javascript文件,css文件等

有谁知道如何最好地实现这一目标 - 以及任何可能陷入困境的陷阱。

我尝试过使用简单的html dom解析器 - 但是获得一致性很棘手,我也不知道如何使用两组标签,body标签等会影响网站。

如果有人以前管理过这个并且可以指出他们使用的工具/一般方法我将永远感激不尽!

请注意 - 我非常精通谷歌和堆栈溢出,并先看了那里!

1 个答案:

答案 0 :(得分:0)

理想的HTML解决方案

解决任意站点的相对路径的最简单方法是使用基本href标记指定默认的相对位置(只需使用文件名的URL,例如<base href="http://www.example.com/path/to/" />作为URL http://www.example.com/path/to/page。这应该位于头部的顶部。

然后,您只需找到相关部分并将其包装在您自己的标记中(例如跨度)即可更改网站。对于这些标记的格式设置,最简单的方法是添加style属性,但您也可以尝试在<style>中插入<head>标记。

当然,您还需要考虑没有<html><head><body>标记的网页制作不当的网页。你可以将源包装在一组新的这些标签中,或者只是放入你的base和style标签,希望浏览器可以解决该怎么做。

你可能也想让这个交互式,所以你也应该用某种链接包装它们,理想情况下你会插入一些javascript来处理ajax的动作。您还应该在页面顶部插入自己的标题,可能浮动在顶部,以便他们知道他们正在使用您的工具。请记住,某些高级页面可能会与您的更改发生冲突(但是对于那些情况,您可能会有一个链接说'此页面无法正确显示?'以将用户带到原始基本列表框页面作为备份。)< / p>

更强大的解决方案

显然,上述内容存在许多潜在问题,即使它是理想的。如果您想要确保稳健性并避免在您尝试更改的页面上使用自定义javascript和css的任何问题,您可以使用与基于文本的浏览器(如lynx)中使用的算法类似的算法来一致地重新格式化页面。然后,您可以应用算法突出显示页面的相关部分,您也可以应用自己的格式,而不会有正确显示的风险。通过这种方式,您可以很好地构建它并维护您的界面。

这个问题是你失去了原始页面的实际外观,但你应该保持数字和地址的上下文,这是重要的事情。然后,您还可以使用一些动态javascript将用户连续带到每个号码和地址,以改善用户体验。基本上,这是严格的,让您完全控制用户体验,但您失去了网站的原始外观,可能会或可能不会混淆您的用户。


就个人而言,我会选择第二个选项,但我不确定是否有人之前创建过这样的解析器。如果没有,你可以做的最简单的事情是剥离标签,使其成为纯文本。下一个最简单的方法是将其转换为一些简单的文本标记格式,如markdown,然后将其转换回html。这样,你就会保留一些基本的布局,比如标题,斜体和粗体等等。

您绝对不希望拥有嵌套的body标签。它可能会起作用,但它可能会破坏你的格式并在浏览器中不一致。


以下是我在Google快速搜索后找到的资源:

https://github.com/nickcernis/html-to-markdown

还有其他html到markdown脚本,但这比我发现的少数几个更强大。我仍然不确定它是否可以处理格式错误的页面或具有高级格式的页面,请自行尝试。

虽然html转换器有很多降价,但事实上你可能很容易自己制作一个自定义转换器来满足你的个人需求。