Как искать amazon с расширением google Chrome?

Я хочу расширение chrome Google, которое дает слово от пользователя и ищет его на веб-сайте amazon и показывает результаты поиска на одной странице HTML для пользователя.Как искать amazon с расширением google Chrome?

Я попробовать с JavaScript и DOM, и это мои коды:

manifest.json:

{ 
    "manifest_version": 2, 

    "name": "Amazon Search", 
    "description": "This extension to sarch from Amazon.com", 
    "version": "0.1", 

    "browser_action": { 
    "default_icon": "amazon.png", 
    "default_popup": "form.html" 
    }, 
    "background": 
    { 
    "scripts": ["search.js"] 
    }, 
    "permissions": [ 
    "activeTab", 
    "tabs", 
    "https://ajax.googleapis.com/", 
    "https://amazon.com/" 
    ] 
}

form.html:

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="UTF-8"> 
    <title>Form</title> 
    <script src="search.js"></script> 
</head> 
<body> 
    <form> 
     <label>Search : </label><input type="text" id="search" /> 

     <button id="gotoamazon" >Search Amazon</button> 

    </form> 

</body> 
</html>

search.js:

var searchItem = document.getElementById('search').value; 
    console.log(searchItem); 

    function amazon(){ 
     window.open('https://amazon.com','_blank'); 
     document.getElementById('twotabsearchtextbox').value = searchItem; 
     document.getElementById('nav-search-submit-text').click(); 
     var results = document.getElementById('resultsCol').value; 
    }; 

    document.getElementById('gotoamazon').addEventListener('click', amazon);

У меня есть некоторые проблемы, которые как показать результаты поиска (переменная результатов) на другой странице?

источник

2017-02-19 zerOOne

Не указывайте один и тот же сценарий DOM на разных страницах, потому что фоновая страница - это другой контекст. Требуемое чтение: extensions architecture.
Щелкните правой кнопкой мыши расширение всплывающее окно и выберите Проверьте, чтобы открыть DevTools для всплывающего окна вы увидите ошибки в закладке консоли: <script src="search.js"></script> выполняет сценарий синхронно, то есть там нет ничего в теле еще так что ваш код не сможет получить элемент. Или используйте событие DOMContentLoaded или переместите тег сценария перед закрывающим тегом </body>.
Вам не нужно разрешение на амазонку, так как вы не пытаетесь получить к ней доступ напрямую.
Нет необходимости в сценарии фоновой страницы.

Эта задача может быть решена без сценария:

Нет необходимости открывать окно вручную, используйте форму, которая отправляет в _blank и поиска URL в амазонке, которая вы можете копировать с фактической страницы результатов поиска на сайте (необязательно удаляя параметры отслеживания/вспомогательные параметры): https://www.amazon.com/s/?field-keywords=derp
Использование <button type="submit">
Использование type="search" в input предоставить историю автозаполнения и x кнопку, которая очищает поле.
Путь input внутри label - таким образом, вы также можете щелкнуть по метке, чтобы сфокусировать вход.

<html> 
<head> 
    <title>Form</title> 
</head> 
<body> 
    <form target="_blank" action="https://www.amazon.com/s/"> 
     <label>Search : 
      <input type="search" name="field-keywords"> 
     </label> 
     <button type="submit">Search Amazon</button> 
    </form> 
</body> 
</html>

Это откроет новую вкладку переднего плана с поиском амазонки. Если вам нужна вкладка фона, сценарий необходим, и он должен использовать chrome.tabs.create({url: newUrl, active: false})

источник

2017-02-19 15:22:58 wOxxOm

Как искать amazon с расширением google Chrome?

ответ

Смежные вопросы