百度网页关键字抓取(一下吧使用Ie9的的方法(一)(图))

　　百度网页关键字抓取(一下吧使用Ie9的的方法(一)(图))

　　2012-9-14 10:43 上传

　　点击文件名下载附件

　　这个效果大家都见过吧

　　

　　如何把他介绍给自己的网站？一起来分析一下

　　使用Ie9的“开发工具”，就可以轻松搞定。当您输入关键字时，百度如何获得智能提示是相关关键字。

　　让我们来看看

　　

　　可以清楚的看到，每次我们修改查询框，百度都会发送Ajax请求来调整相应的数据

　　地址为：Blog&p=3&cb=window.bdsug.sug&t=86

　　大家看不难，博客wd=blog是我输入的关键字。如果要使用其他关键字，只需要对 wd 的值进行过多的修改即可。

　　这时候大家就会这么想了，我们是不是应该只发一个Get请求，只要我们每次查询自己的网站就动态发送一个Ajax请求访问这个地址？是的，

　　但是大家，不要傻傻的使用Http请求，因为这样的请求是从你的服务器发起的。当然，百度肯定会屏蔽你。

　　我们需要做些什么来避免这个问题？

　　那么只有一种方式，在客户端使用js来执行请求。因为js是在客户端发起的，即使是百度封锁，也封锁了所有过度使用你的用户网站，相信百度不会傻到这一步。正因为如此，他们失去了很多用户

　　所以这个方法应该成立

　　但是大家都知道js不能跨，百度也不能给你跨，或者权限，我们该怎么办？

　　简单，上面我们已经看到，百度给了我们一个Jsonp数据格式，那么我们可以直接使用Jsonp方法发起ajax请求，因为返回Jsop格式数据的JS可以跨

　　让我们来看看我的代码。

　　[HTML] 纯文本视图复制代码

　　

function FillUrls() {

var strdomin = $.trim($("#Text1").val());

var qsData = { 'wd': strdomin, 'p': '3', 'cb': 'ShowDiv', 't': '1324113456725' };

$.ajax({

async: false,

url: "http://suggestion.baidu.com/su",

type: "GET",

dataType: 'jsonp',

jsonp: 'jsoncallback',

data: qsData,

timeout: 5000,

success: function (json) {

},

error: function (xhr) {

alert(xhr);

}

});

}

　　代码非常简单。大家应该第一眼就明白了。我只是解释一下这句话。

　　var qsData = {'wd': strdomin,'p': '3','cb':'ShowDiv','t': '25' };

　　wd 是我们要输入的关键字。

　　你不需要担心 p 和

　　cb是什么？Ajax 返回是一个直接调用的方法。一是方法在百度返回的数据中执行，我们不需要做任何处理。

　　只写一个接受数据的方法

　　[HTML] 纯文本视图复制代码

　　function ShowDiv(strurls) {

var urls = strurls["s"];

}

　　urls 这是我们需要的数据。我们来看看调用后返回的数据的样式。

　　ShowDiv({q:"Blog",p:false,s:["Blog China","Blog Garden","Blog Bus","Blog Net","Blog Login","Blog Registration","Blog Search" ,"博客群发帖","博客新浪","博客群发帖大师"]});

　　这是百度返回的数据。我们只需要 s 之后的数据。现在我们应该明白我写 var urls = strurls["s"]; 的意思了。

　　您可以一次尝试一下。

　　因为百度只返回数据，所以我们要做一个智能盒子，当然我们可以自己定义外观。我们先来看看这个盒子

　　[HTML] 纯文本视图复制代码

　　样式如下

　　[CSS] 纯文本视图复制代码

　　#allSitesBoxHdl.classlist

{

position: absolute;

background-color: #F5FBFF;

width: 256px;

border: 1px solid #C9E4F4;

top: 28px;

left: 0;

text-align: left;

font-size: 14px;

line-height: 30px;

padding: 1px;

}

#allSitesBoxHdl.classlist li

{

display: inline;

}

#allSitesBoxHdl.classlist li.lis a

{

text-decoration: none;

height: 30px;

width: 210px;

float: left;

padding-left: 8px;

color: #666;

}

#allSitesBoxHdl.classlist li.lis a:hover

{

color: #016493;

background-color: #edf6fb;

}

#allSitesBoxHdl.classlist li.lis a:active

{

color: #016493;

background-color: #edf6fb;

}

#allSitesBoxHdl.classlist li.lis input

{

cursor: pointer;

color: #FF6600;

border-right: 1px solid #ccc;

border-bottom: 1px solid #ccc;

height: 22px;

margin: 4px;

line-height: 22px;

float: right;

background: #fff;

}

.wena

{

color: #666;

font-size: 12px;

height: 30px;

line-height: 30px;

width: 250px;

float: left;

}

　　第一步，我们需要一个注册事件来完成控件的一些效果事件的绑定，只有我们输入数据才能实现效果

　　方法如下

　　[HTML] 纯文本视图复制代码

　　

//注册对象的事件

function Init() {

$("#allSitesBoxHdl")[0].style.display = "none";

$(":text").each(function () {

if ($(this)[0].getAttribute('url') == 'true') {//给所有的text加属性

$(this).bind("keyup", OnKeyup); //按键时

$(this).bind("mousedown", BoxShowUrls); //鼠标安下时

$(this).bind("mouseout", BoxHide); //鼠标离开时

$(this).bind("paste", OnPaste); //处理http;//

$(this)[0].setAttribute("autocomplete", "off");

}

});

}

　　在这个方法中，这句话 if ($(this)[0].getAttribute('url') =='true') {//给所有 url=true 属性添加效果文本

　　也就是说只要我们引用这个网页的Text框中有一个url='true'的属性，就可以达到这个效果。也就是说，我们只需要引入样式和js文件，然后想要那个控件显示就可以添加一个属性

　　url='true' 就可以了，其他什么都不需要做。是不是很方便？

　　我们来看看绑定方法的实现

　　下面是整个js文件（这里还包括同时输入多个文本框的效果）

　　[] 纯文本视图复制代码

<p>