Communities

Writing
Writing
Codidact Meta
Codidact Meta
The Great Outdoors
The Great Outdoors
Photography & Video
Photography & Video
Scientific Speculation
Scientific Speculation
Cooking
Cooking
Electrical Engineering
Electrical Engineering
Judaism
Judaism
Languages & Linguistics
Languages & Linguistics
Software Development
Software Development
Mathematics
Mathematics
Christianity
Christianity
Code Golf
Code Golf
Music
Music
Physics
Physics
Linux Systems
Linux Systems
Power Users
Power Users
Tabletop RPGs
Tabletop RPGs
Community Proposals
Community Proposals
tag:snake search within a tag
answers:0 unanswered questions
user:xxxx search by author id
score:0.5 posts with 0.5+ score
"snake oil" exact phrase
votes:4 posts with 4+ votes
created:<1w created < 1 week ago
post_type:xxxx type of post
Search help
Notifications
Mark all as read See all your notifications »

Welcome to Software Development on Codidact!

Will you help us build our independent community of developers helping developers? We're small and trying to grow. We welcome questions about all aspects of software development, from design to code to QA and more. Got questions? Got answers? Got code you'd like someone to review? Please join us.

Review Suggested Edit

You can't approve or reject suggested edits because you haven't yet earned the Edit Posts ability.

Approved.
This suggested edit was approved and applied to the post 4 months ago by Alexei‭.

162 / 255
How to establish a relationship between HTML elements (tags)? (i.e., how can one element refer to another one)
Should I use the [`data-*` attributes][1] for this or is there a more idiomatic way?

---

For context, I'm trying to convert annotated legal PDF documents to HTML. Certain parts of these documents are crossed out when a new amendment is added, timestamped, and a "sticky note" directs readers to the section in the new amendment that supersedes it. My goal is to create a sort of "time machine" (or version controlled) document where one specifies a date, and the document will be rendered with only the parts that would have been in effect at that time.

For example, if this was a quote from one of the PDFs:  
<sup>From Wikipedia's [Gall's Law](https://en.wikipedia.org/wiki/John_Gall_(author)#Gall's_law) article.</sup>

> <s>Complex systems are the best way to start a project.</s> (See `amendment 1`, 7/30/2024)
> 
> (`amendment 1`, 7/30/2024) A complex system that works is invariably found to have evolved from a simple system that worked. A complex system designed from scratch never works and cannot be patched up to make it work. You have to start over with a working simple system.

My naive initial solution would be something like this:

```html
<p data-date-added="3/9/2021" data-superseded-by-amendment="1">
  Complex systems are the best way to start a project.
</p>
<!-- ... lots of other stuff ... -->
<p data-date-added="7/30/2024" data-amendment-id="1">
  A complex system  that  works  is invariably found
  to have evolved  from a simple system that worked. 
  A complex system designed from scratch never works
  and cannot be patched up to make it work. You have
  to start over with a working simple system.
</p>
```



  [1]: https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes

Suggested 4 months ago by Karl Knechtel‭