How to render an anchor that points to the internal note?

Is there any option to put Obsidian internal link inside HTML tag? Maybe some custom URI scheme, like obsidian://something ? I just need to render some custom view and using DataviewJS dv.filelink() inserts lots of HTML that I breaks all the markup I’m trying to implement. Here is the snippet. I’ve tried to put file path inside href which obviously doesn’t work.

const projects = dv.pages('"Backlog" and #project');
for (let project of projects) {
  const total = project.file.tasks.length;
  const completed = project.file.tasks.filter((task) => task.completed).length;
  let div = await dv.el('div', '', { cls: 'x-progress', attr: { 'data-label': project.file.name } });
  div.createEl("a", { cls: 'x-value', attr: { style: 'width:' + (completed / total * 100) + "%;", href: project.file.path } });
}

Obsidian does have a URI scheme documented in the Help docs. But also

dv.el('a', "My display text", {'attr': {'href': myPath}});

worked for me and looked correct in the “Elements” view in the Developer Console.

I’m not familiar enough with web APIs/HTMLElement/createEl to understand why that bit wasn’t working for you. Can you use the dv.el to make the anchor, and then put it inside the div?

div.createEl("a", ...) actually works. I just forgot to add anchor text, so it was invisible, sorry. I published full snippet on the forum in case it could help someone in the future.

1 Like

Hurrah! Glad it works. HTML is complicated - one of the things I appreciate about Markdown and tools like dataview is that they will make the HTML for me. But I am always impressed by the advanced things folks like you come up with, thanks for sharing!

1 Like

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.