JavaScript String link() Method

What You’ll Learn

String.prototype.link() is a deprecated HTML wrapper method (same API as MDN String.prototype.link()). It returns a string that wraps your text in an <a href="..."> tag. Learn quote escaping, how it differs from anchor(), and how to replace it with the DOM — with five examples and try-it labs.

Introduction

Early JavaScript included helpers that wrapped text in HTML tags — link(), anchor(), bold(), italics(), and others. link() built a hyperlink string you could drop into innerHTML.

Today those wrappers are deprecated. link() may still return a string for compatibility. Real <a href> links remain essential HTML, but you should create them with the DOM — not string methods.

This page is part of JavaScript String Methods. Related topics include anchor() and italics().

Understanding the link() Method

Calling str.link(url) does not create a live DOM node. It concatenates an HTML string: an opening <a href="..."> tag, the original text, and a closing </a>.

• It is an instance method on strings (auto-boxed if needed).
• It returns a new string — the original is unchanged.
• Double quotes inside url become ".
• Ampersands (&) are not auto-escaped — prefer & when building attribute text by hand.
• Prefer DOM APIs for real links in the page.

📝 Syntax

General form of String.prototype.link:

str.link(url)

Parameters

• url — any string used as the href attribute (relative or absolute URL). Coerced to a string if needed. MDN notes that & characters should be written as & in HTML attribute text.

Return value

A string beginning with <a href="..."> (quotes in url escaped as "), then the text of str, then </a>.

Common patterns

"MDN Web Docs".link("https://developer.mozilla.org/");
// 'MDN Web Docs'

"x".link('a"b');
// 'x'

// Prefer this in new code:
const elem = document.createElement("a");
elem.href = "https://developer.mozilla.org/";
elem.textContent = "MDN Web Docs";
// document.body.appendChild(elem);

Examples Gallery

Examples follow MDN String.link() patterns. Use View Output or Try It Yourself for each case.

const contentString = "MDN Web Docs";
contentString.link("https://developer.mozilla.org/");
// 'MDN Web Docs'

<a href="https://developer.mozilla.org/">MDN Web Docs</a>

"x".link('a"b');
// 'x'

"".link("https://example.com");
// ''

typeof "Hi".link("https://example.com");  // "string"

<a href="a&quot;b">x</a>
<a href="https://example.com"></a>
string

const contentString = "MDN Web Docs";
const html = contentString.link("https://developer.mozilla.org/");
// document.body.innerHTML = html;  // legacy pattern — avoid in new apps

console.log(html);
// Prefer createElement("a") in new apps

<a href="https://developer.mozilla.org/">MDN Web Docs</a>
(legacy pattern — prefer createElement instead of string HTML)

"Hi".link("https://example.com"); // 'Hi'
"Hi".anchor("section1");          // 'Hi'
"Hi".bold();                      // 'Hi'
"Hi".italics();                   // 'Hi'

<a href="https://example.com">Hi</a>
<a name="section1">Hi</a>
<b>Hi</b>
<i>Hi</i>

const contentString = "MDN Web Docs";
const elem = document.createElement("a");
elem.href = "https://developer.mozilla.org/";
elem.textContent = contentString;

// document.body.appendChild(elem);
console.log(elem.tagName);
console.log(elem.href);
console.log(elem.outerHTML);

A
https://developer.mozilla.org/
<a href="https://developer.mozilla.org/">MDN Web Docs</a>

🚀 Common Use Cases

• Reading legacy tutorials — recognize HTML wrapper methods in old samples.
• Migrating old scripts — replace link() with createElement("a").
• Teaching string immutability — show that methods return new strings.
• Not for new apps — do not use link() to build hyperlinks in new apps.
• Safer markup — prefer textContent + DOM properties over innerHTML strings.
• Contrast with anchor() — link = href; anchor = obsolete name.

📝 Notes

• link() is deprecated — standardized only for compatibility.
• The method is deprecated; the <a href> element itself remains valid HTML.
• It returns a string, not a DOM node.
• Double quotes in url are escaped as ".
• Ampersands are not auto-escaped — follow MDN and use & when writing attribute HTML by hand.
• Other HTML wrappers (anchor(), bold(), italics(), …) share the same fate.
• Avoid assigning untrusted strings to innerHTML.

💡 Best Practices