2018年7月25日 星期三

快速清除table表格或div內的所有屬性,以便取得乾淨的html碼

這篇主要是備註,有時從客戶端取得的製作文件 如:表格、設定過格式的ppt或doc文件檔案等等,需要把內容移植成html格式,使用以下的方法可快速得到乾淨的html檔案

以下以ppt檔案內的表格為例,假設ppt檔案內有一個複雜的表格要轉為html碼

1.開啟ppt檔案,轉存為pdf

2.使用acrobat開啟該pdf,然後轉存為html檔案

/* 以上兩個步驟主要是要把ppt檔案的表格轉存為html檔案,使用別的方式也可以 */

3.開啟html檔案,通常會看到html碼內已經被設定了一堆密密麻麻的屬性,此時先大概刪除掉不需要的部分,取得單純的<table></table> 這一段內的html碼

4.在該文件加上html , head, body,.....  等等網頁tag,另外也順便掛上jquery引用路徑

5.在最後加上下面的java script

<script>
 $(function(){     $('*').removeAttr('style');   //移除文件內的所有style 屬性     $('*').removeAttr('class');   //移除文件內的所有class 屬性     $('*').removeAttr('bgcolor');    //移除文件內的所有bgcolor 屬性     $('* p').contents().unwrap();   //把所有用<p>包起來的內容解開(移除<p></p>)   }) </script>

/* 按照上面的邏輯可以自己加上想要移除的tag或屬性 */

6.使用瀏覽器瀏覽該網頁檔案

7.使用chrome的 /檢視/開發人員選項/開發人員工具 檢視,從檢視碼內就可以把去掉tag及屬性的內碼copy出來


沒有留言: