title: Jquery html data-bind attribute use of its
body: <p>I've come across this kind of codes on my HTML file, Here, i just to want to understand what is this <code>data-bind</code> attribute and its <code>values</code>(example: <code>visible: tabs.active().value === 'sourceXml'</code>). what it does here? Any one kindly explain.</p>
  
  <pre><code>&lt;div style="border: solid #ddd; border-width: 0 1px 1px 1px; padding: 16px 12px 8px 12px; margin-top: -20px"&gt;
      &lt;div data-bind="visible: tabs.active().value === 'sourceXml'"&gt;
      &lt;div data-bind="template: { name: 'sourceXml', data: sourceXml }"&gt;&lt;/div&gt;
  &lt;/div&gt;
  
  &lt;div data-bind="visible: tabs.active().value === 'searchTerms'"&gt;
      &lt;div data-bind="template: { name: 'searchTerms', data: searchTerms }"&gt;&lt;/div&gt;
  &lt;/div&gt;
  
  &lt;div data-bind="visible: tabs.active().value === 'outputFormat'"&gt;
      &lt;div data-bind="template: { name: 'outputFormat', data: outputFormat }"&gt;&lt;/div&gt;
  &lt;/div&gt;
  
  &lt;div data-bind="visible: tabs.active().value === 'savedQueries'"&gt;
      &lt;div data-bind="template: { name: 'savedQueries', data: savedQueries }"&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>