尝试访问铬扩展中的表单元素的值时出错

我正在做一个Chrome扩展，当按下按钮时，我得到当前的URL和输入字段中的值。尝试访问铬扩展中的表单元素的值时出错

，但我得到的错误：

Uncaught TypeError: Cannot read property 'value' of null at HTMLButtonElement.myAlert

在该行：

var ip = document.getElementById('ip_dns').value;

如何获取并存储该值的正确方法是什么？

这里是我的代码：

popup.html

<!doctype html> 
<html> 
    <head> 
    <title>DNS Teste</title> 
    <script src="popup.js"></script> 
    </head> 
    <body> 
    <form> 
     IP DNS 
     <input type="text" ip="ip_dns"> 
     <button id="btn">Teste</button> 
    </form> 
    </body> 
</html>

popup.js

function myAlert(){ 
    chrome.tabs.getSelected(null, function(tab) { 
    var url = tab.url; 
    console.log("url: "+ url); 
    }); 
    var ip = document.getElementById('ip_dns').value; 
    console.log("IP: "+ip); 
} 

document.addEventListener('DOMContentLoaded', function() { 
    document.getElementById('btn').addEventListener('click', myAlert); 
});

的manifest.json

{ 
    "manifest_version": 2, 

    "name": "Getting started example", 
    "description": "This extension shows a Google Image search result for the current page", 
    "version": "1.0", 

    "browser_action": { 
    "default_icon": "icon.png", 
    "default_popup": "popup.html" 
    }, 
    "permissions": [ 
    "activeTab", 
    "https://ajax.googleapis.com/", 
    "tabs" 
    ] 
}

来源

2017-02-10 Julio Cesar

你在这里错字：，也许这就是问题？将其更改为 –

它的工作原理

function myAlert(){ 
 
    // chrome.tabs.getSelected(null, function(tab) { 
 
    // var url = tab.url; 
 
    // console.log("url: "+ url); 
 
    // }); 
 
    var ip = document.getElementById('ip_dns').value; 
 
    console.log("IP: "+ip); 
 
} 
 

 
document.addEventListener('DOMContentLoaded', function() { 
 
    document.getElementById('btn').addEventListener('click', myAlert); 
 
});

<form> 
 
    IP DNS 
 
    <input type="text" id="ip_dns"> 
 
    <button id="btn">Teste</button> 
 
</form>

来源

2017-02-10 21:35:38

尝试访问铬扩展中的表单元素的值时出错

回答

相关问题