Javascript 如何使用jquery获取Google搜索API结果href值
我使用简单的谷歌API来显示搜索结果。我想在鼠标上方或单击时获取链接的href值。使用什么风格的javascript并不重要,我只需要获得用户选择的呈现搜索的href值 我需要这个,因为我有一个允许用户保存他们感兴趣的链接的Web服务 我在客户端脚本编写方面很糟糕,所以我真的需要一只手。在这里的示例中,我使用了默认的GoogleAjax搜索API示例 无法连接 我已经使用了链接- -供简单参考,无济于事。我相信这是由于谷歌搜索结果显示的方式/页面呈现顺序 html源预呈现如下所示:Javascript 如何使用jquery获取Google搜索API结果href值,javascript,jquery,Javascript,Jquery,我使用简单的谷歌API来显示搜索结果。我想在鼠标上方或单击时获取链接的href值。使用什么风格的javascript并不重要,我只需要获得用户选择的呈现搜索的href值 我需要这个,因为我有一个允许用户保存他们感兴趣的链接的Web服务 我在客户端脚本编写方面很糟糕,所以我真的需要一只手。在这里的示例中,我使用了默认的GoogleAjax搜索API示例 无法连接 我已经使用了链接- -供简单参考,无济于事。我相信这是由于谷歌搜索结果显示的方式/页面呈现顺序 html源预呈现如下所示: &l
<!--
copyright (c) 2009 Google inc.
You are free to copy and use this sample.
License can be found here: code.google.com/apis/ajaxsearch/faq/#license
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Google AJAX Search API Sample</title>
<script src="http://www.google.com/jsapi?key=AIzaSyA5m1Nc8ws2BbmPRwKu5gFradvD_hgq6G0" type="text/javascript"></script>
<script type="text/javascript">
/*
* How to do a search that returns the max number of results per page.
*/
google.load('search', '1');
function OnLoad() {
// create a search control
var searchControl = new google.search.SearchControl();
// Set the Search Control to get the most number of results
searchControl.setResultSetSize(google.search.Search.LARGE_RESULTSET);
// Create 2 searchers and add them to the control
searchControl.addSearcher(new google.search.WebSearch());
searchControl.addSearcher(new google.search.BlogSearch());
// Set the options to draw the control in tabbed mode
var drawOptions = new google.search.DrawOptions();
drawOptions.setDrawMode(google.search.SearchControl.DRAW_MODE_TABBED);
// Draw the control onto the page
searchControl.draw(document.getElementById("content"), drawOptions);
// Search!
searchControl.execute("Subaru STI");
}
google.setOnLoadCallback(OnLoad);
</script>
</head>
<body style="font-family: Arial;border: 0 none;">
<div id="content">Loading...</div>
</body>
</html>
The relevent rendered result html source is as follows:
<div class="gs-webResult gs-result">
<div class="gs-title">
<a class="gs-title" href="http://en.wikipedia.org/wiki/Subaru_Impreza_WRX_STI" target="_blank">
<b>Subaru</b> Impreza WRX <b>STI</b> - Wikipedia, the free encyclopedia</a></div>
如果有人能给我指出正确的方向,我将非常感激。
非常感谢,Dave,我对你正在使用的Google库不是很确定-从快速搜索中我可以看出,它似乎被弃用了。您可能希望链接到从何处获取样本 如果只想在单击或鼠标悬停时提取href,可以执行以下操作:
$('a.gs-title').live('click', function(e){
e.preventDefault();
console.log('clicked', $(this).attr('href'));
});
这将使用jQuery的事件处理程序将此click处理程序附加到具有类gs标题的每个元素,即使稍后将其添加到页面中,只要将第一个参数更改为mouseover而不是click即可。处理程序本身只会阻止默认的单击操作,因此您会发现链接不起作用,并将href记录到控制台。您可以根据自己的需要调整它。我使用了两个文件
ajax.html
<html>
<head>
<style>
#container
{
border:1px solid black;
height: 20px;
width: 230px;
background: #5CCCCC;
position: absolute;
color: white;
display: none;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
</head>
<body>
<p>hello how are you?</p>
<p>Please run this file with localhost url only else it won't work</p>
<p>you can double click at any word to get the no of results</p>
<div id="container"></div>
<script>
var p = $('p');
p.html(function(index, oldHtml) {
return oldHtml.replace(/\b(\w+?)\b/g, '<span class="word">$1</span>')
});
p.click(function(event) {
var x=event.pageX;
var y=event.pageY;
$("#container").css(
{
"top":y+"px",
"left":x+"px"
}).fadeIn(500);
$("#container").text("Loading....");
var a=event.target.innerHTML;
$("#container").load("index.php?str="+a+" #resultStats"); //Since number of results are saved in a id named resultStats,using that to filter the content.from google page.
});
</script>
</body>
</html>
另一个文件是一个.php文件,我在那里ping google服务器以获取总结果数
index.php:
<?php
$str_to_search=$_REQUEST['str'];
$a=file_get_contents("http://www.google.com/search?q=define+". $str_to_search);
echo $a;
?>
请记住通过php服务器运行这两个文件。谢谢。我最终使用silverlight渲染输出。您的示例使用Jquery处理已贬值的GoogleAPI。非常确定live函数已被弃用。IIRC,它通过一个额外的参数集成到on中。