3

html 模板作为资源编译到应用程序中。HTML 模板的片段如下所示：

<A href="%PANELLINK%" target="_blank">
   <IMG border="0" src="%PANELIMAGE%" style="%IMAGESTYLE%">
</A><BR>
%CAPTIONTEXT%

我喜欢这样，因为较大的资源 HTML 文件包含样式、无怪癖模式等。

但与往常一样，他们现在希望选择在没有链接的情况下省略 Anchor 标签。此外，如果没有标题，则应省略 BR 标签。

考虑的技术 Nº1

鉴于我不想在 C# 代码中构建整个 HTML 片段，我考虑过类似的事情：

%ANCHORSTARTTAGPREFIX%<A href="%PANELLINK%" target="_blank">%ANCHORSTARTTAGPOSTFIX%
   <IMG border="0" src="%PANELIMAGE%" style="%IMAGESTYLE%">
%ANCHORENDTAGPREFIX%</A>%ANCHORENDTAGPOSTFIX%CAPTIONPREFIX%<BR>
%CAPTIONTEXT%%CAPTIONPOSTFIX%

我的想法是我可以使用前缀和后缀将 HTML 代码转换为：

<!--<A href="%PANELLINK%" target="_blank">-->
   <IMG border="0" src="%PANELIMAGE%" style="%IMAGESTYLE%">
<!--</A>--><!--<BR>
%CAPTIONTEXT%-->

但这太荒谬了，再加上一位回答者提醒我们，它浪费了带宽，而且可能是错误的。

考虑的技术 Nº2

批发更换吊牌：

%AnchorStartTag%
   <IMG border="0" src="%PANELIMAGE%" style="%IMAGESTYLE%">
%AnchorEndTag%%CaptionStuff%

并进行查找替换以进行更改

%AnchorStartTag%

和

"<A href=\"foo\" target=\"blank\""

考虑的技术 Nº3

我考虑给重要的 HTML 元素一个 ID：

<A id="anchor" href="%PANELLINK%" target="_blank">
   <IMG border="0" src="%PANELIMAGE%" style="%IMAGESTYLE%">
</A><BR id="captionBreak">
%CAPTIONTEXT%

然后使用 HTML DOM 解析器以编程方式删除节点。但是要获得一个值得信赖的 HTML DOM 解析器并不容易。如果 HTML 改为 xhtml，我将使用各种内置/原生可用的 xml DOM 解析器。

考虑的技术 Nº4

到目前为止，我实际上拥有的是：

private const String htmlEmptyTemplate = 
    @"<!DOCTYPE HTML PUBLIC ""-//W3C//DTD HTML 4.01//EN\"""+Environment.NewLine+
    @"   ""http://www.w3.org/TR/html4/strict.dtd"">"+Environment.NewLine+
    @"<HTML>"+Environment.NewLine+
    @"<HEAD>"+Environment.NewLine+
    @"  <TITLE>New Document</TITLE>"+Environment.NewLine+
    @"  <META http-equiv=""X-UA-Compatible"" content=""IE=edge"">"""+Environment.NewLine+
    @"  <META http-equiv=""Content-Type"" content=""text/html; charset=UTF-8"">"+Environment.NewLine+
    @"</HEAD>"+Environment.NewLine+
    @""+Environment.NewLine+
    @"<BODY style=""margin: 0 auto"">"+Environment.NewLine+
    @"  <DIV style=""text-align:center;"">"+Environment.NewLine+
    @"      %ContentArea%"+Environment.NewLine+
    @"  </DIV>" + Environment.NewLine +
    @"</BODY>" + Environment.NewLine +
    @"</HTML>";

private const String htmlAnchorStartTag = 
    @"<A href=""%PANELLINK%"" target=""_blank"">";

//Image is forbidden from having end tag
private const String htmlImageTag = 
    @"<IMG border=""0"" src=""%PANELIMAGE%"" style=""%IMAGESTYLE%"">";

private const String htmlCaptionArea =
    @"<BR>%CAPTIONTEXT%";

我已经想挖出我的眼球了。在代码中构建 HTML 是一场噩梦。编写是一场噩梦，调试是一场噩梦，维护是一场噩梦——这会让下一个人的事情变得困难。我希望有另一个解决方案 - 因为我是下一个人。

4

6 回答 6

11

我在这个游戏中的声望点已经很低了，这让我可以自由地非常明确地告诉您，先生或女士，您非常需要 XSLT。如果做不到这一点（您可能会这样做），您需要查看 VB.NET 中的XML 文字（它为您提供了您正在寻找的基于模板的解决方案......）。因为我更喜欢留在 C# 中（即使我是在 VBA 出生和长大的），所以我使用 XSLT。

我的两个不受欢迎的建议都要求使用 XHTML 而不是 HTML。对于许多传统开发人员来说，仅此一项要求就相当令人反感。通过您对 HTML 元素使用大写字母，我已经可以看出，您会发现我的言论完全没有用。所以我现在应该停止写作了。

于 2008-12-17T20:48:02.477 回答
2

怎么样：将 XML 存储为您的片段：

<fragment type="link_img_caption">
  <link href="%PANELLINK%" />
  <img src="%PANELIMAGE%" style="%IMAGESTYLE%" />
  <caption text="%CAPTIONTEXT%" />
</fragment>

将其拉出，用“真实”字符串替换占位符（当然，您已经仔细地进行了 XML 转义），

...并使用简单的 XML 转换来生成 HTML 输出：

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
  <xsl:output method="html" version="4.0" encoding="iso-8859-1" indent="yes"/>

  <xsl:template match="/">
    <xsl:apply-templates select="fragment" />
  </xsl:template>

  <xsl:template match="fragment[@type = 'link_img_caption']">
    <xsl:choose>
      <xsl:when test="link[@href != '']">
        <a href="{link/@href}" target="_blank">
          <img src="{img/@src}" style="{img/@style}" border="0" />
        </a>
      </xsl:when>
      <xsl:otherwise>
        <img src="{img/@src}" style="{img/@style}" border="0" />
      </xsl:otherwise>
    </xsl:choose>
    <xsl:if test="caption[@text !='']">
      <br />
      <xsl:value-of select="caption/@text" />
    </xsl:if>
  </xsl:template>

</xsl:stylesheet>

type由于该属性，可以添加其他片段类型。有很大的改进空间，因此可以将其作为如何完成的示例。

输出：

<a href="%PANELLINK%" target="_blank">
  <img src="%PANELIMAGE%" style="%IMAGESTYLE%" border="0">
</a>
<br>
%CAPTIONTEXT%

并且，如果 XML 中的链接 href 为空：

<img src="%PANELIMAGE%" style="%IMAGESTYLE%" border="0">
<br>
%CAPTIONTEXT%
于 2008-12-17T21:06:38.430 回答
2

使用模板引擎，例如其中之一。

于 2008-12-17T23:12:36.647 回答
0

1.) 不要使用评论，你会向浏览器发送无用的数据，浪费带宽并遇到IE 中的 BUG。

2.）作为某种方法，这不是更好吗？（我不熟悉 C#）但这样的事情对我来说更有意义。

//using PHP in this example
function HTMLImage($imageData, $linkData){
  var str = '';
  //if there is link data, start <a> tag
  $str .= '<a '.{expand any attributes}.'>';

  //add image tag and attributes from $imageData
  $str .= '<img '.{expand any attributes}.'/>';

  //if there is link data, close <a> tag
  $str .= '</a>';
  return $str;
}
于 2008-12-17T20:48:53.050 回答
0

我会使用Template Toolkit，不幸的是它目前只在Perland中实现Python。

test.pl：

use Template;

my $template = Template->new({
  VARIABLES => {
    ImageStyle  => "default",
    CaptionText => "Place Caption Here"
  },
});

$template->process( 'test.tt', {
    panel => {
      link  => "http://Stackoverflow.com/",
      image => "/Content/Img/stackoverflow-logo-250.png",
      alt   => "logo link to homepage"
    }
} );

test.tt：


[% IF panel.link -%]
<A href="[% panel.link %]" alt="[% panel.alt %]" target="_blank">
[%- END -%]

[%- IF panel.image -%]
   <IMG border="0" src="[% panel.image %]" style="[% ImageStyle %]">
[%- END -%]

[%- IF panel.link %]</A>[% END %]<BR>
[% CaptionText %]

输出：

<A href="http://Stackoverflow.com/" alt="logo 链接到主页" target="_blank">
   <IMG 边框="0" src="/Content/Img/stackoverflow-logo-250.png" style="default">
</A><BR>
在此处放置标题

如果panel.link未定义变量，它会跳过锚标记。

   <IMG 边框="0" src="/Content/Img/stackoverflow-logo-250.png" style="default">
<BR>
在此处放置标题
于 2008-12-17T23:08:34.003 回答
0

模板是一种严重的代码气味。看看Seaside是如何生成html的。

[编辑] 另一个没有线索的人投了反对票。

于 2008-12-24T21:20:06.600 回答