JS跨域抓取信息

2014-05-18 19:43:26

众所周知,JS是不能跨域抓取数据的,除非有授权。所以本文并非真的直接跨域抓取,而是换个思路。通过转折,先用PHP抓取所需信息,然后传给JS.

今日,应老师要求,给学校做一个无线网登陆页面。为了更好的适应PC,移动终端,选择bootstrap快速开发,静态页面马上完工。剩下的便是今天要说到的问题:

要从学校主页http://www.bistu.edu.cn抓取通知数据和http://news.bistu.edu.cn/zhxw/抓取学校要闻,都取最新的五条,由于是HTML页面,PHP显得苍白无力,只好用JS。。可惜JS基本白痴,Google发现还不能跨域,虽然有些解决办法,貌似很复杂,对JS小白是在做不到啊~

于是想到了先用PHP正则抓到新闻,(期间也用php生成json数组供JS远程调用,略显麻烦)输出让JS舒服的数组,然后JS再上简单多了,说上就上,首先看需要抓取的页面的源码,找到所需信息的特定标签,然后直接PHP匹该标签。废话不说,直接贴出正则:

[php]

]*class="xs2 mar_top15"[^>]*>(.*?)<\/div>/si’, $text,$match); foreach($match[0] as $key => $news) { if($key<5) echo $news ; //只取前五条信息 } ?>

[/php]

运行一下,看看抓到了什么:

QQ图片20140518231050

看来抓取成功了,到底抓到了什么,再看看,加一句print_r ($match[0]);再运行看看:

Array ( [0] =>  [1] =>  [2] =>  [3] =>  [4] =>  [5] =>  ) 

正是所需信息,可是看看链接,发现不对,中的标签都是相对链接,不仅有./还有../(好贱)而我需要的是绝对链接,怎么办?正则出链接在替换?不用那么麻烦,直接上代码:

[php]

]*class="xs2 mar_top15"[^>]*>(.*?)<\/div>/si’, $text,$match); $match = str_replace(‘../’, ‘
http://news.bistu.edu.cn/’, $match[0]);  //替换../ $match = str_replace(‘./’, ‘http://news.bistu.edu.cn/zhxw/’, $match);  //替换./ foreach($match as $key => $news) { if($key<5) echo $news ; } ?>

[/php]

这回再看看:

好了,链接换成绝对链接了,php的工作完成了,剩下的交给JS,让js调用php正则好的五条新闻即可,用innerHTML直接将五条信息输出到html指定的id下面。直接上代码:

[code lang=”js”]

[/code]

一切完成,最终效果请看这儿:http://1.ibin.sinaapp.com/

其中通知和新闻热点就是这样抓过来的~

CSS实现网页背景半透明

使用DIV+CSS实现层与背景半透明效果。 说明: 1、filter:对win IE设置半透明滤镜效果,filter:alpha(Opacity=80)代表该对象80%半透明,火狐浏览器不认 2、-moz-opacity:对mozilla firefox火狐浏览器实现半透明,win IE不认此属性,-moz-opacity:0.5相当于设置半透明为50% 3、opacity:对除IE外所有浏览器支持包括谷歌,放最后主要针对谷歌浏览器,opacity: 0.5;表示设置50%半透明 为了观察到对DIV半透明实现,我们设置两个DIV层,分别一个放于另外一个DIV层内,外层DIV命名为“.div-a”;上面被包含的层CSS类命名为“.div-b”,形成“.div-b”盒子放于“.div-a”内 我们对底层DIV设置一个背景是一张图片,上面的DIV盒子设置村黑色。 一.未设置半透明样式实例 [php] css背景半透明www.

How to prevent IFRAME from redirecting top-level window

I use sandbox=”…” allow-forms allows form submission allow-popups allows popups allow-pointer-lock allows pointer lock allow-same-origin allows the document to maintain its origin allow-scripts allows JavaScript execution, and also allows features to trigger automatically allow-top-navigation allows the document to break out of the frame by navigating the top-level window Top navigation