JavaScript以最佳方式缩短长行

let html = '<div class="container"><h1>' + title + '</h1><p>' + content + '</p><ul>' + items.map(item => '<li>' + item + '</li>').join('') + '</ul></div>';

let html = `
  <div class="container">
    <h1>${title}</h1>
    <p>${content}</p>
    <ul>
      ${items.map(item => `<li>${item}</li>`).join('')}
    </ul>
  </div>
`;

// 原始长行代码
let title = "Hello World";
let content = "This is a long text.";
let items = ["Item 1", "Item 2", "Item 3"];
let html = '<div class="container"><h1>' + title + '</h1><p>' + content + '</p><ul>' + items.map(item => '<li>' + item + '</li>').join('') + '</ul></div>';

// 缩短后的代码
let htmlShortened = `
  <div class="container">
    <h1>${title}</h1>
    <p>${content}</p>
    <ul>
      ${items.map(item => `<li>${item}</li>`).join('')}
    </ul>
  </div>
`;

console.log(htmlShortened);