This / That / These / Those
Grammar Lesson
📚 Grammar Rules
Word Distance Number Example
This Near Singular (1) This book is mine
That Far Singular (1) That car is red
These Near Plural (2+) These books are mine
Those Far Plural (2+) Those cars are red
💡 Remember:
  • This/These = things NEAR you (close)
  • That/Those = things FAR from you (distant)
  • This/That = ONE thing (singular)
  • These/Those = MORE than one thing (plural)
👁️ Distance Visual
🧑‍🎓

You are here

📚

THIS book
(near you)

📚

THAT book
(far from you)

Near you: This pen is blue. / These pens are blue.
Far from you: That pen is red. / Those pens are red.
Choose the Correct Answer
1. _____ is my favorite book. (pointing to a book in your hand)
This
That
These
Those
2. _____ cars over there are very expensive.
This
That
These
Those
3. _____ shoes I'm wearing are comfortable.
This
That
These
Those
4. Do you see _____ bird in the tree far away?
This
That
These
Those
Correct Answers: 1. This, 2. Those, 3. These, 4. That
🎯 Drag and Drop Practice

Drag these words:

this
that
these
those

Complete the sentences:

book is interesting. (near)
students are studying. (far)
apples are sweet. (near)
house is big. (far)
✍️ Write Your Own Sentences

Write 4 sentences using this/that/these/those. Look around your room or classroom for ideas!

Ideas:
  • Point to something near you → use this or these
  • Point to something far away → use that or those
  • One thing → this/that
  • Many things → these/those
Example sentences:
• This computer is new and fast.
• That mountain in the distance is very high.
• These cookies taste delicious.
• Those people across the street are my neighbors.
• This chair is comfortable to sit on.
• That music sounds beautiful.
let choiceAnswers = {1: 'this', 2: 'those', 3: 'these', 4: 'that'}; let selectedChoices = {}; function selectChoice(element) { const question = element.dataset.question; const answer = element.dataset.answer; // Remove selection from other options in the same question const questionOptions = document.querySelectorAll(`[data-question="${question}"]`); questionOptions.forEach(opt => { opt.classList.remove('selected', 'correct', 'incorrect'); }); // Select current option element.classList.add('selected'); selectedChoices[question] = answer; } function checkAllChoices() { let correct = 0; const totalQuestions = Object.keys(choiceAnswers).length; for (let question in choiceAnswers) { const correctAnswer = choiceAnswers[question]; const userAnswer = selectedChoices[question]; const questionOptions = document.querySelectorAll(`[data-question="${question}"]`); questionOptions.forEach(opt => { opt.classList.remove('selected'); if (opt.dataset.answer === correctAnswer) { opt.classList.add('correct'); } else if (opt.dataset.answer === userAnswer && userAnswer !== correctAnswer) { opt.classList.add('incorrect'); } }); if (userAnswer === correctAnswer) { correct++; } } document.getElementById('choice-score').style.display = 'block'; document.getElementById('choice-score').textContent = `Score: ${correct}/${totalQuestions} correct!`; } function showChoiceAnswers() { toggleAnswer('choice-answers'); } // Drag and Drop functionality let draggedElement = null; document.addEventListener('DOMContentLoaded', function() { const draggables = document.querySelectorAll('.draggable'); const dropZones = document.querySelectorAll('.drop-zone'); draggables.forEach(draggable => { draggable.addEventListener('dragstart', function(e) { draggedElement = this; this.style.opacity = '0.5'; }); draggable.addEventListener('dragend', function(e) { this.style.opacity = '1'; }); }); dropZones.forEach(dropZone => { dropZone.addEventListener('dragover', function(e) { e.preventDefault(); this.classList.add('drag-over'); }); dropZone.addEventListener('dragleave', function(e) { this.classList.remove('drag-over'); }); dropZone.addEventListener('drop', function(e) { e.preventDefault(); this.classList.remove('drag-over'); if (draggedElement) { // Clear the drop zone first this.textContent = ''; // Clone the dragged element const clone = draggedElement.cloneNode(true); clone.style.position = 'static'; clone.style.margin = '0'; clone.setAttribute('draggable', 'false'); // Add the word to the drop zone this.appendChild(clone); } }); }); }); function checkDragDrop() { const dropZones = document.querySelectorAll('.drop-zone'); let correct = 0; dropZones.forEach(zone => { const correctAnswer = zone.dataset.correct; const droppedWord = zone.querySelector('.draggable'); if (droppedWord && droppedWord.dataset.word === correctAnswer) { zone.style.border = '2px solid #4CAF50'; zone.style.background = 'rgba(76,175,80,0.1)'; correct++; } else { zone.style.border = '2px solid #f44336'; zone.style.background = 'rgba(244,67,54,0.1)'; } }); document.getElementById('drag-score').style.display = 'block'; document.getElementById('drag-score').textContent = `Drag & Drop Score: ${correct}/${dropZones.length} correct!`; } function resetDragDrop() { // Reset drop zones const dropZones = document.querySelectorAll('.drop-zone'); dropZones.forEach(zone => { zone.textContent = ''; zone.style.border = '2px dashed #ccc'; zone.style.background = 'transparent'; }); // Reset draggable items const dragWordsContainer = document.querySelector('.drag-words'); dragWordsContainer.innerHTML = `

Drag these words:

this
that
these
those
`; // Re-attach event listeners const newDraggables = document.querySelectorAll('.draggable'); newDraggables.forEach(draggable => { draggable.addEventListener('dragstart', function(e) { draggedElement = this; this.style.opacity = '0.5'; }); draggable.addEventListener('dragend', function(e) { this.style.opacity =