从HTML文件

Question

创建CSS我有一个包含许多内容的HTML文件：

<div> 
    <div id="imgElt11289447233738dIi15v" style="BORDER-RIGHT: 0px; BORDER-TOP: 0px; Z-INDEX: 1; LEFT: 795px; BORDER-LEFT: 0px; WIDTH: 90px; CURSOR: auto; BORDER-BOTTOM: 0px; POSITION: absolute; TOP: 186px; HEIGHT: 93px" lineid="lineid" y2="279" y1="186" x2="885" x1="795"> 
     <img style="WIDTH: 90px; HEIGHT: 93px" height="21" alt="Image" src="../images//k03.jpg" width="25" name="imgElt11289447233738dIi15vNI1m6G" tag="img"></img></div> 
    <div id="imgElt11288263284216dIi15v" style="BORDER-RIGHT: 0px; BORDER-TOP: 0px; Z-INDEX: 1; LEFT: 660px; BORDER-LEFT: 0px; WIDTH: 147px; CURSOR: auto; BORDER-BOTTOM: 0px; POSITION: absolute; TOP: 1964px; HEIGHT: 22px" lineid="lineid" y2="1986" y1="1964" x2="807" x1="660"> 
     <img style="WIDTH: 147px; HEIGHT: 22px" height="21" alt="Image" src="../images//k03.jpg" width="25" name="imgElt11288263284216dIi15vNI1m6G" tag="img"></img></div> 
    <div id="txtElt11288262779851dIi15v" style="BORDER-RIGHT: 0px; BORDER-TOP: 0px; Z-INDEX: 2872735; LEFT: 250px; BORDER-LEFT: 0px; WIDTH: 95px; CURSOR: auto; BORDER-BOTTOM: 0px; POSITION: absolute; TOP: 1514px; HEIGHT: 18px" selectedindex="0" pos_rel="false" lineid="lineid" y2="1532" y1="1514" x2="345" x1="250" tag="div"> 
     <p><strong><font face="arial,helvetica,sans-serif" size="2">Course Name</font></strong></p> 
    </div> 
    <div id="txtElt11288262309675dIi15v" style="BORDER-RIGHT: 0px; BORDER-TOP: 0px; Z-INDEX: 1565881; LEFT: 40px; BORDER-LEFT: 0px; WIDTH: 430px; CURSOR: auto; BORDER-BOTTOM: 0px; POSITION: absolute; TOP: 1464px; HEIGHT: 34px" selectedindex="0" pos_rel="false" lineid="lineid" y2="1498" y1="1464" x2="470" x1="40" tag="div"> 
     <p><strong> 
     <font face="arial,helvetica,sans-serif" size="2" tag="font">16. Please 
     write below the Course Name in order of preference.</font></strong></p> 
     <p tag="p"><strong><font face="Arial" size="2" tag="font">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; (Please 
     see the &quot;Instructions to Candidate&quot; for list of courses)</font></strong></p> 
    </div> 
</div> 

可以看出，1个格中有很多的div。现在我想创建一个包含这个html页面所有样式的css文件（不一定是相同的）。必须用java代码写东西。我有这个文件的DOM对象可用于我。

基本上，我想从这里带走所有的风格和喜欢下id为DIV一个CSS文件将被保留= imgElt11289447233738dIi15v CSS将是：

#imgElt11289447233738dIi15v{BORDER-RIGHT: 0px; BORDER-TOP: 0px; Z-INDEX: 1; LEFT: 795px; BORDER-LEFT: 0px; WIDTH: 90px; CURSOR: auto; BORDER-BOTTOM: 0px; POSITION: absolute; TOP: 186px; HEIGHT: 93px} 

我不直到这部分但是因为我不知道元素的层次结构会有多少层次，所以还有什么办法可以对所有的子元素进行相同的操作？

我用下面的代码

public static Document getStyleInCSSfile(Document aoDoc, String aoPathToWrite, String aoFileName) throws ApplicationException { 
    String loValue = null; 
    String loID = null; 
    String lsContent = ""; 
    Element loRoot = aoDoc.getRootElement(); 
    List loTempElementList = loRoot.getChildren(); 
    int liCounter; 
    for (liCounter = 0; liCounter < loTempElementList.size(); liCounter++) { 
     Element loTemplateEle = (Element) loTempElementList.get(liCounter); 
     String loId=loTemplateEle.getAttribute("id").getValue(); 
     loID = loTemplateEle.getAttributeValue("id"); 
     if(null != loID) 
     { 
      loValue = loTemplateEle.getAttributeValue("style"); 
      if(loValue!=null && loValue.trim().length()>0) 
      { 
       loTemplateEle.removeAttribute("style"); 
       lsContent = lsContent.concat("#"+loID+"{"+loValue+"}\n"); 
      } 
     } 
    } 
    SaveFormOnLocalUtil.writeToFile(aoPathToWrite,aoFileName,lsContent); 
    return aoDoc; 
} 

编辑：认识了一些正则表达式可以通过获取SAX解析器对象的字符串，并使用它的正则表达式...任何想法帮助吗？任何人？如何实现它

Answer 1

我认为你应该使用SAX而不是DOM。在SAX中，您可以注册每次解析器看到新标签，属性等时调用的处理程序。在这种情况下，每当您看到属性“style”时，都应该将其值提取到CSS文件中。

下一个方法是使用来自jakarta.apache.org的Digester。它使用SAX并允许XML配置（请参阅DigesterDigester），它将您的值对象直接映射到您的XML文档。

绝对不同的解决方案可以使用如grep和sed UNIX外壳命令进行。对其中一种解决方案的偏好取决于您的系统要求以及您需要多长时间运行一次该代码。如果是一次转换，请使用unix shell脚本。如果它必须是健壮的，并且实时更改页面，请使用java解决方案。

Answer 2

为每个标签定义样式是否有效？
如果我是你，我会检查是否有其他标签具有相同的风格，如果用一种风格的所有元素具有相同的“TAG_NAME”我会用以下内容：

tag_name{text-transform:uppercase;text-align:center;} 

，并与该每个元素标签名称（如果其样式未以其他方式设置）将具有此样式。
如果有很多不同的标记具有相同的风格：

.class_name{text-transform:uppercase;text-align:center;} 

<tag class="class_name">content</tag>