| <!DOCTYPE html> | 
 | <html> | 
 |   <head> | 
 |     <title>Virtual Collection demo</title> | 
 |     <script src="../src/vc.js"></script> | 
 |     <style> | 
 | div { | 
 |   padding: 2pt; | 
 |   padding-left: 10pt; | 
 |   border: 2px solid black; | 
 | } | 
 |  | 
 | span { | 
 |   margin: 2pt; | 
 |   padding: 2pt; | 
 |   color: white; | 
 |   background-color: green; | 
 | } | 
 |  | 
 | div.undefined { | 
 |   background-color: red; | 
 |   height: 12pt; | 
 |   min-width: 100px; | 
 | } | 
 |     </style> | 
 |   </head> | 
 |   <body> | 
 |     <div id="vc"></div> | 
 |     <script> | 
 |     var json = { | 
 |       "@type":"korap:docGroup", | 
 |       "operation":"operation:or", | 
 |       "operands":[ | 
 |         { | 
 |           "@type":"korap:docGroup", | 
 |           "operation":"operation:and", | 
 |           "operands":[ | 
 |             { | 
 |               "@type":"korap:doc", | 
 |               "key":"Titel", | 
 |               "value":"Baum", | 
 |               "match":"match:eq" | 
 |             }, | 
 |             { | 
 |               "@type":"korap:doc", | 
 |               "key":"Veröffentlichungsort", | 
 |               "value":"hihi", | 
 |               "match":"match:eq" | 
 |             } | 
 |           ] | 
 |         }, | 
 |         { | 
 |           "@type":"korap:doc", | 
 |           "key":"Untertitel", | 
 |           "value":"huhu", | 
 |           "match":"match:eq" | 
 |         } | 
 |       ] | 
 |     }; | 
 |  | 
 | //      var vc = KorAP.VirtualCollection.render(); | 
 |       var vc = KorAP.VirtualCollection.render(json); | 
 |       console.log(vc); | 
 |       document.getElementById('vc').appendChild(vc.element()); | 
 |     </script> | 
 |   </body> | 
 | </html> |