Skip to content
A relational database using <table> tags and jQuery
Latest commit 55d3702 Apr 8, 2008 Nick Kallen formatting README
Failed to load latest commit information.
README.markdown formatting README Apr 8, 2008
example.html documentation Apr 8, 2008
jquery.db.js added source Apr 8, 2008

README.markdown

Today I was thinking aloud about Tree Regular Expressions and how they might make a nice query language for document databases like CouchDB. Someone pointed out that CSS3 selectors might make a great concrete syntax for this. One thing lead to another and I thought, why not build a relational database in HTML? So I did. I even got inner joins working.

Let's start with a few tables:

<table class="users">
  <tr>
    <td class="id">1</td>
    <td class="first_name">amy</td>
    <td class="last_name">bobamy</td>
  </tr> 
  ...
</table>
<table class="photos">
  <tr>
    <td class="id">1</td>
    <td class="user_id">1</td>
    <td class="url">http://www.example.com/foo.png</td>
  </tr> 
</table>

Now we can express some queries:

$('.users')
  .where('.id:eq(1)')
  .select('*')

This is equivalent to SELECT * FROM users WHERE id = 1

$('.users')
  .where('.id:eq(1)')
  .select('.id, .name')

This is equivalent to SELECT id, name FROM users WHERE id = 1. Here is something slightly more complicated:

$('.users')
  .where('.name:contains(a)')
    .and('.name:contains(c)')
  .select('*')

But here is the crowning glory, the inner join:

$('.users')
  .join('.photos')
  .where('.photos.user_id:eq(.users.id)')
    .and('.users.id:eq(1)')
  .select('.photos.url')

This is equivalent to:

SELECT photos.url FROM users, photos
WHERE photos.user_id = users.id
  AND users.id = 1

Download the fun at Github.

Something went wrong with that request. Please try again.