CODEWITHSUNDEEP
html
Gallaxhar
Gallaxhar

Reputation: 1036

Filtering (hide or show) schema in HTML5 only

Using html5 only, without css or anything else, is it possible to have a sentence like this,

She loves him.

be schema'd with HTML5 so that the word "She" is tagged with metadata such as "Subject", "loves" is tagged with "verb", "him" is tagged with "object", and all of it together including the period, "She loves him." is tagged with "complete sentence".

Then, a user could filter what they want to display - elements tagged as Subjects, verbs, objects, or complete sentences... or mixtures of these.

For example, maybe you want to see all complete sentences and all objects, regardless if they are in a complete sentence or not.

Another example, if you had a bunch of sentences on a webpage, you could quickly filter to see only the verbs.

I'm looking for a way to accomplish this - a game plan for how to structure the tags. If I use divs, will that be robust enough to let me tag complete sentences and the individual words inside them, or is there a cleaner way, a more concise way, etc?

Upvotes: 0

Views: 46

Answers (1)

dixiechris
dixiechris

Reputation: 46

You're not going to be able to do this with just HTML. You're going to need to use Javascript to show and hide those elements. You'll need CSS to make it look good.

A way you could get started is to put spans around different parts of the sentence.

<span class="full-sentence><span class="subject">She</span><span class="verb">loves</span><span class="object">him</span>.

Then you need to look into using jQuery to show and hide the different parts of the sentence.

If you don't want to use Javascript, you could alternatively use CSS on the span classes to color the subject, verb and object.

Upvotes: 1

Related Questions