序列化包含所有CSS屬性的DOM元素

我正在開發像yola.com這樣的在線網站設計系統。序列化包含所有CSS屬性的DOM元素

我想獲得應用CSS屬性及其值到任何DOM元素的列表。

例如，我有一個h1標記，它的css在調整大小和拖動時會隨機由jquery ui進行更改，還會通過tinymce等更改其文本修飾以及文本內容。

我在這個頁面有一個保存按鈕。當我點擊保存時，我想使用php將所有這些更改保存到數據庫中。現在我的目標是隻知道每個元素的CSS和內部文本內容。我怎樣才能做到這一點？

什麼是「實現CSS屬性」？ – BoltClock 2011-04-10 09:50:58

投票結束。你需要添加更多的上下文 – JohnP 2011-04-10 09:51:04

哪些？通過內聯樣式設置？在作者樣式表中設置了哪些？在瀏覽器樣式表中設置的人員？只有標準屬性？專有的瀏覽器屬性呢？ – Quentin 2011-04-10 09:52:15

在javascript中，你可以通過調用

element.getClassName();

在火狐和Chrome的至少當前版本找到一個元素的當前類的名稱，你可以找到直接應用樣式

element.getAttribute("style");

這將包括編程應用的職位，例如在http://jqueryui.com/demos/draggable/你可以做

document.getElementById('draggable').getAttribute("style"); 
"position: relative; "

和周圍拖動可拖動，如果你再這樣做，你會得到當前位置後：

document.getElementById('draggable').getAttribute("style"); 
"position: relative; left: 63px; top: 39px; "

你可以得到元素的元素內容.innerHTML。那加上風格加上類名可能足以正確地串行化一個元素。如果你想序列化一個完整的複雜組件樹，這將是一個稍微複雜的過程 - innerHTML只適用於相對簡單的元素。

2011-05-12 12:10:52 kybernetikos

回答