如何将 EventListener 添加到 Amazon 提交按钮答案

【问题标题】：How to add an EventListener to the Amazon submit button如何将 EventListener 添加到 Amazon 提交按钮
【发布时间】：2016-11-01 04:18:42
【问题描述】：

我正在尝试将来自亚马逊的提交按钮作为我的事件，以便我可以阅读该人正在搜索的内容，但我无法让它工作。我不确定如何准确定位按钮。

myscript.js

function getProduct(){
    console.log('getProduct');
    var textbox = document.getElementById('twotabsearchtextbox').value;
    console.log(textbox.value);
    init(); 
}

function init(){
    console.log('in init');
    var i = document.getElementsByClassName('nav-input');
    console.log(i[0].value);
    console.log(i[1].value);
    i[0].addEventListener('onclick', getProduct );
}
function testen(){
    console.log('test');
}
window.onload = init;

manifest.json

{
    "name": "Bachelortest",
    "description": "teste",
    "version": "1.0",
    "manifest_version":2,

    "browser_action":{
    "default_icon":"icon.png",
    "default_popup":"popup.html"
    },
    "permissions":["tabs", "storage", "activeTab" ,"geolocation"],

    "background": {
    "scripts": ["background.js"]
    },

      "content_scripts": [
    {
      "matches": ["https://*/*","http://*/*", "https://www.amazon.de/*"],
      "js": ["jquery-1.12.3.min.js","myscript.js"]
    }
  ]

}

【问题讨论】：

当您只与很少的网站进行交互时，请不要编写将内容脚本加载到每个页面的扩展程序"matches": ["https://*/*","http://*/*",...。这样做会使您的扩展程序消耗每个网页的资源。

标签： javascript html google-chrome google-chrome-extension

【解决方案1】：

您应该将事件侦听器添加到表单提交中：

document.querySelector('.nav-searchbar').addEventListener('submit', event => {
  console.log(document.querySelector('#twotabsearchtextbox').value)
})

【讨论】：

非常感谢
顺便说一句，i[0].addEventListener('onclick', getProduct ) 不起作用，因为事件是 click，而不是 onclick