如何使用jquery獲取Google搜索API結果href值

我正在使用簡單的Google API來顯示搜索結果。我想獲得鼠標懸停或點擊鏈接的href值。 javascript的味道真的不重要，我只需要獲得用戶選擇的href值就可以了。如何使用jquery獲取Google搜索API結果href值

（我需要這個，因爲我有一個Web服務，它允許用戶保存他們找到感興趣的鏈接。）

我在客戶端腳本太可怕了，所以我真的可以用一隻手。以這裏的示例爲例，我使用默認的Google AJAX Search API示例。

To visually explain I have posted this image.（不能附加）

我已經使用了鏈接 - How to get href value using jQuery? - 簡單參考無濟於事。我相信這是由於顯示谷歌搜索結果的方式/頁面渲染順序。

HTML源代碼預渲染如下：

<!-- 
    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>

如果任何人都可以點我在正確的方向，我真的很感激。感謝百萬，戴夫

來源

2010-09-27 DaveCS

我不太確定你使用的谷歌庫 - 從我可以從快速搜索中可以看出它似乎被棄用。您可能想要鏈接到您從中獲取樣本的位置。

如果你只是想提取的click或mouseover的href，你可以這樣做：

$('a.gs-title').live('click', function(e){ 
     e.preventDefault(); 
     console.log('clicked', $(this).attr('href')); 
    });

這使用jQuery的live()事件處理這個點擊處理程序附加到具有一流的每<a>元素gs-title ，即使稍後將其添加到頁面（要在mouseover上執行此操作，只需將第一個參數更改爲mouseover而不是click）。處理程序本身不會做任何事情，但會阻止默認的點擊操作（因此您會發現鏈接不起作用）並將href記錄到控制檯。您可以根據您的要求進行調整。

來源

2011-03-16 04:33:03

謝謝。我結束了使用silverlight渲染輸出。您的示例適用於使用Jquery的折舊Google api。 – DaveCS 2011-03-22 03:45:35

很確定'live'函數已被棄用。 IIRC，它通過一個額外的參數被集成到'on'中。 – Carcigenicate 2016-02-25 18:49:34

我已經使用了兩個文件。

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文件。

的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服務器上運行這兩個文件。

來源

2013-12-27 07:24:08 NamingException

如何使用jquery獲取Google搜索API結果href值

回答

相關問題