how to use jquery in content script chrome extension

Question

How to use Jquery in content.js.

Here is my code

manifest.json

    "background": {
    "scripts": ["jquery-1.12.2.min.js","background.js"]
  },
  "content_scripts": [{
    "matches": [ "http://*/*", "https://*/*"],
    "js": ["jquery-1.12.2.min.js","content.js"]
  }],
    "permissions": [
    "tabs",
    "activeTab",
    "http://*/*",
    "https://*/*",
    "<all_urls>"

  ]

background.js

chrome.tabs.create({url: "https://www.google.com/search?gws_rd=cr&as_qdr=all&q=" + encodeURIComponent(searchQ)}, function (tab){openSearchLink(tab)});
var createdTabId = 0;
function openSearchLink(tab){
    console.log("new tab "+tab.id);
    createdTabId = tab.id;

}

content.js

// Listen for messages
chrome.runtime.onMessage.addListener(function (msg, sender, sendResponse) {
    // If the received message has the expected format...
    if (msg.text === 'report_back') {
        // Call the specified callback, passing
        // the web-page's DOM content as argument
        var resAry = {};
        console.log('dddd-'+$('#bname').val());
        resAry['bName'] = $('#bname').val().trim();
        sendResponse(resAry);
    }
});

resAry['bname'] is returning empty response. Where as, I am getting value when I use document.getElementById

Answer 1

在popup.html的行下面添加了技巧

<script src="jquery-1.12.2.min.js"></script>