如何在chrome浏览器中获取当前选项卡的URL和标题，并在用户单击我的扩展图标时显示它

在Chrome浏览器中获取当前选项卡的URL和标题，并在用户单击扩展图标时显示它，可以通过Chrome扩展的开发来实现。

首先，需要创建一个Chrome扩展项目，包括一个manifest.json文件和一个popup.html文件。

manifest.json文件是扩展的配置文件，需要在其中声明权限和指定扩展的图标、名称等信息。以下是一个示例的manifest.json文件内容：

{
  "manifest_version": 2,
  "name": "获取当前选项卡的URL和标题",
  "version": "1.0",
  "permissions": [
    "tabs"
  ],
  "browser_action": {
    "default_popup": "popup.html",
    "default_icon": {
      "16": "icon16.png",
      "48": "icon48.png",
      "128": "icon128.png"
    }
  },
  "icons": {
    "16": "icon16.png",
    "48": "icon48.png",
    "128": "icon128.png"
  }
}

在上述示例中，我们声明了需要获取tabs权限，并指定了扩展的图标和名称。

接下来，在popup.html文件中编写扩展的弹出窗口内容。可以使用JavaScript来获取当前选项卡的URL和标题，并在用户单击扩展图标时显示它。以下是一个示例的popup.html文件内容：

<!DOCTYPE html>
<html>
<head>
  <title>获取当前选项卡的URL和标题</title>
  <script src="popup.js"></script>
</head>
<body>
  <h1 id="title">标题</h1>
  <p id="url">URL</p>
</body>
</html>

在上述示例中，我们使用了一个h1元素来显示标题，一个p元素来显示URL，并引入了一个名为popup.js的JavaScript文件。

最后，在popup.js文件中编写JavaScript代码来获取当前选项卡的URL和标题，并在弹出窗口中显示它们。以下是一个示例的popup.js文件内容：

chrome.tabs.query({ active: true, currentWindow: true }, function(tabs) {
  var tab = tabs[0];
  var title = tab.title;
  var url = tab.url;

  document.getElementById('title').textContent = title;
  document.getElementById('url').textContent = url;
});

在上述示例中，我们使用了chrome.tabs.query方法来获取当前活动的选项卡信息，并通过tab.title和tab.url属性获取标题和URL。然后，将它们分别设置到id为"title"和"url"的元素中。

完成以上步骤后，将manifest.json、popup.html和popup.js文件打包成一个压缩文件，然后在Chrome浏览器中打开扩展程序页面（chrome://extensions/），启用开发者模式，点击"加载已解压的扩展程序"按钮，选择打包的压缩文件，即可加载并使用该扩展。

当用户单击扩展图标时，弹出窗口将显示当前选项卡的URL和标题。

请注意，以上示例中的代码仅适用于Chrome浏览器，其他浏览器可能需要使用不同的API来实现相同的功能。