时间戳

首页 > 解决方案 > 使用 vanilla JavaScript 进行 HTML 模板化

javascript - 使用 vanilla JavaScript 进行 HTML 模板化

问题描述

我有一个 SharePoint 应用程序，它可以从库中检索页面内容，并同时提供桌面和移动网站。我们在页面中也有链接，如何使用 vanilla JavaScript 呈现 HTML 模板？

例如，我们有几个来自页面内容的页面链接：

<a class="template" href="/3.aspx">

我想添加http://<sitename>/pages/或添加http://<sitename>/pages/m/href 取决于屏幕尺寸或设备。

我怎样才能通过 vanilla JS 实现这一目标？

标签： javascripthtmltemplating

解决方案

使用名为lit-html的轻量级库很简单：

import { html, render } from 'https://unpkg.com/lit-html/lit-html.js?module';

const linkTemplate = orientation =>
  html`<a href="https://<sitename>/pages/{orientation != null ? 'm/' : '/'}3.aspx">Link text</a>`

render(linkTemplate(window.orientation), container)

推荐阅读