title: how do i toggle on/off content_scripts in a google extension?
body: <p>I have this simple extension, it displays icon on chrome's toolbar and shows a enable/disable button. i want to add function to the button to disable or enable the <code>content_script.js</code> which fires on visiting google website:</p>
  
  <p>popup.js</p>
  
  <pre><code>var setLayout = function(){
      var list = document.createElement('ul');
  
      var enable = document.createElement('li');
      enable.appendChild(document.createTextNode('Enable Script'));
      enable.onclick = function(){toggle(0)};
  
      var disable = document.createElement('li');
      disable.appendChild(document.createTextNode('Disable Script'));
      disable.onclick = function(){toggle(1)};
  
      list.appendChild(disable);
      document.body.appendChild(list);
  
      function toggle(n){
          list.removeChild( n == 0 ? enable : disable);
          list.appendChild(n == 0 ? disable : enable);
      }
  };
  
  document.addEventListener('DOMContentLoaded', setLayout, false);
  </code></pre>
  
  <p>manifest.json</p>
  
  <pre><code>{
    "manifest_version": 2,
  
    "name": "test",
    "description": "test",
    "version": "1.0",
  
    "browser_action": {
      "default_icon": "icon.png",
      "default_popup": "popup.html"
    },
    "content_scripts": [
      {
        "matches": ["https://www.google.co.uk/"],
        "js": ["content_scripts.js"]
      }
    ]
  }
  </code></pre>
  
  <p>content_scripts.js</p>
  
  <pre><code>(function(){
      alert('hello');
  })();
  </code></pre>
  
  <p>i'm new to google extensions and have no idea how to do that, i thought about changing the manifist after clicking disable/enable buttons but couldn't find the right command to do so after reading the documentations on google website!</p>
  
  <p>any help would be greately appreciated.</p>