2010-12-14 5 views
6

からCSSの作成:見ることができるようには、私は多くの要素が含まれているhtmlファイル持っている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が、その中に多くのdivを持っています。今、私はこのHTMLページのすべてのスタイリングを含むCSSファイルを作成したい(同じである必要はない)。 Javaコードで何かを書く必要があります。私はこのファイルのDOMオブジェクトを利用できます。

基本的に、私はすべてのスタイルここから削除されるとid = imgElt11289447233738dIi15vのCSSでdivのためのような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パーサオブジェクトの文字列を取得し、その上に正規表現を使用することによって助けることを知った...任意のアイデアを?誰でも?それを実装する方法

答えて

0

DOMの代わりにSAXを使うべきだと思います。 SAXでは、パーサが新しいタグや属性などを見るたびに呼び出されるハンドラを登録することができます。この場合、属性 "style"が表示されるたびにその値をCSSファイルに抽出する必要があります。

次に、jakarta.apache.orgのDigesterを使用しています。これはSAXを使用し、値オブジェクトをXMLドキュメントに直接マップするXML設定(DigesterDigesterを参照)を許可します。

grepやsedのようなUNIXシェルコマンドを使用して、まったく異なる解決策を作成することもできます。ソリューションの1つに対する優先順位は、システム要件とこのコードを実行する頻度に依存します。それが1回の変換であれば、UNIXシェルスクリプトを使用してください。それが堅牢なものでなければならず、その場でページを変更する必要がある場合は、Javaソリューションを使用します。

+0

私は読書、DOMのためのSAXパーサーを使用。しかし、作成される木構造の各要素をたどる方法を見つけることができませんでした。 – Varun

+1

done SAXパーサーを使用して、要件に基づいて再帰関数を作成しました。 – Varun

1

単一のタグごとにスタイルを定義するのは効果的ですか?
私があなただったら他のタグは、同じスタイルを持っており、一つのスタイルを持つすべての要素が同じ「タグ名」を持っていた場合、私は次のように使用したい場合、私がチェックしたい:

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

、これですべての要素タグ名(スタイルが他の方法で設定されていない場合)はこのスタイルになります。
異なるタグの多くは、同じスタイルであるかどう:

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

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

+0

ほとんどすべての要素に対して異なるスタイルを使用します。 – Varun