繁体   English   中英

用另一个元素包装HTML元素?

[英]Wrapping an HTML element with another element?

我正在编写一个解析一些HTML的程序。 具体来说,我正在列表中寻找带下划线的元素,并将这些带下划线的元素转换为超链接。

这是预转换的HTML的示例:

<ul>
  <li>
    <u>Mode selector </u>
  </li>
  <li>
    <u>LAND ALT</u>
  </li>
  <li>
    <u>FLT ALT</u>
  </li>
</ul>

这就是我希望结果看起来像的样子:

<ul>
  <li>
    <a id="triv14522" onclick="TxtLinkAction(15627,15673)">
      <span style="color: rgb(102, 204, 255); font-size: 11pt;">
        <u>Mode selector</u>
      </span>
    </a>
  </l1>
  <li>
    <a id="triv14523" onclick="TxtLinkAction(15627,15674)">
      <span style="color: rgb(102, 204, 255); font-size: 11pt;">
        <u>LAND ALT</u>
      </span>
    </a>
  </li>
    <a id="triv14887" onclick="TxtLinkAction(15627,15679)">
      <span style="color: rgb(102, 204, 255); font-size: 11pt;">
        <u>FLT ALT</u>
      </span>
    </a>
  </li>
</ul>

在我的程序中,我已经为每个带下划线的元素构建了anchor和span元素。 仅供参考,这是我的操作方法:

TrivId = trivId;
ActionItemId = actionItemId;
TextLayerId = textLayerId;
var trivIdText = "id=\"triv" + TrivId + "\"";
var onClickText = "onclick=\"TxtLinkAction(" + TextLayerId + "," + ActionItemId + ")\"";
var anchor = "<a " + trivIdText + " " + onClickText + ">";
var span = "<span style=\"color: rgb(102, 204, 255); font-size: 11pt;\">";  

所以,我的主要问题是我不完全知道如何用我的anchor和span元素来“包装”列表中的每个带下划线的元素。 如果这是XML,则可以使用AddBeforeSelf添加XML元素。 我可以用HTML做类似的事情吗?

注意:我注意到C#标记已被删除,并添加了Javascript标记。 我应该澄清:这是一个解析PowerPoint文档的C#程序。 传入的值之一是HTML格式。 我根本没有使用Javascript,因为这不是实际的网页。 我只是从PowerPoint幻灯片中获取了这个特殊的值,它恰好是HTML格式。

为了进一步说明,这是我正在使用的C#方法。 生成的修改后的HTML将被写到XML文件中。 生成的HTML将存储在XML标记<RTF> ,并将有效HTML作为该标记的值。

public Hyperlink(int textLayerId, int runGroupId)
        {
            TrivId = LectoraTitle.GetId();
            ActionItemId = LectoraTitle.GetId();
            TextLayerId = textLayerId;
            var trivIdText = "id=\"triv" + TrivId + "\"";
            var onClickText = "onclick=\"TxtLinkAction(" + TextLayerId + "," + ActionItemId + ")\"";
            var styleText = "style=\"" + Settings.Default.Style + "\"";

            // build anchor/span and determine where to insert into text.text
            var anchor = "<a " + trivIdText + " " + onClickText + " " + styleText + ">";
            var span = "<span style=\"color: rgb(102, 204, 255); font-size: 11pt;\">";  
            ActionItem = new ActionItem { ActionType = ActionType.rungroup, TargetId = runGroupId };
        }

进一步说明:我假设我可以使用以下代码使用foreach循环遍历HTML元素:

    // note: this is pseudocode
    var nodes = htmlSnippet;

    foreach (var node in nodes)
    {
            // if node is underline element
            // surround node with generated anchor
            // and span elements.
    }

我只是不太确定如何使我的HTML代码段进入可枚举的状态,以便可以对其进行迭代,然后用生成的元素包装一个特定的元素。

新的编辑:因此,在查看HtmlAgilityPack之后,我将其合并到程序中,并像这样遍历Html(变量文本包含HTML值(请参见上面的第一个示例)):

htmlDocument.LoadHtml(text);
var nodes = htmlDocument.DocumentNode.SelectNodes("//u");
foreach (var node in nodes)
{
   // insert code here to wrap the 
   // underline element with the generated
   // anchor/span elements
}

因此,现在我可以解析HTML并仅获取下划线元素。 现在,我需要弄清楚如何用生成的锚点/跨度元素包围这些下划线元素。 我希望可以做类似node.AddParent(anchor)事情。

为了迭代HTML,您可能需要使用HTML Agility Pack

http://htmlagilitypack.codeplex.com/

这里的例子:

http://htmlagilitypack.codeplex.com/wikipage?title=示例

一个体面的方法在这里:

http://www.codeproject.com/Articles/659019/Scraping-HTML-DOM-elements-using-HtmlAgilityPack-H

您可以使用NuGet安装它。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM