thparq

"For those who once loved jQuery, but now live vanilla."

🎯 Interactive Elements

Click the boxes to see thparq in action!

Box 1
Box 2
Box 3
Box 4
Box 5
Box 6
$('.box').$eon('click', function() { $(this).$toggleClass('active'); });

⛓️ Method Chaining Magic

Watch how multiple operations chain together seamlessly!

$('#chain-demo') .$addClass('spinning') .$css({ borderRadius: '50%', background: 'linear-gradient(45deg, #4ecdc4, #44a3aa)' }) .$attr('data-animated', 'true');

🎪 Event Handling

Type something and watch the magic happen!

Start typing to see live updates!
$('#text-input').$eon('input', function() { $('#text-result').$text(`You typed: ${this.value}`); });

🏗️ Dynamic Form Builder

Watch as thparq creates forms on the fly with $append(), $val(), and event delegation!

Your dynamic form will appear here...

Live Form Data:

{}

🃏 Interactive Card System

Drag & drop cards with $parent(), $find(), $data(), and dynamic styling!

🌳 DOM Tree Explorer

Explore parent-child relationships with $parent() and $find()!

Root Container
Section A
Item 1
Item 2
Section B
Item 3
Special Item

Selection Info:

Click on any node to see its relationships!

💬 Real-time Chat Simulator

See $prepend(), $append(), $hasClass(), and event delegation in action!

thparq Chat Demo

🤖
Welcome! Try typing a message below.
Now
Messages: 1 | Characters: 0/100

🚀 Live Code Playground

Write thparq code and see it execute in real-time!

Code Editor:

Live Output:

Target Element 1
Target Element 2
Target Element 3