2010-06-03 2 views
4

Кто-нибудь знает хорошую библиотеку javascript для получения оригинального (то есть не вычисленного) стиля для данного элемента в DOM? Другими словами, что-то можно использовать для получения результатов в вкладке стиля Firebug. Как и Firebug, он должен учитывать наследование, свойства ярлыка и все другие нюансы CSS.Информационная библиотека стиля CSS

+1

Не являясь смартфоном здесь, и я его не использовал, но [firebug lite] (http://getfirebug.com/firebuglite) - это все javasript, не так ли? Это похоже на то, что вы ищете? –

+0

Ничего плохого в том, чтобы быть смартфоном, когда это полезно! :) Это отличная (и довольно очевидная) идея - я проверю источник. Приветствия. –

ответ

1

На основе комментариев, вы можете быть заинтересованы в хорошем Firebug Lite ссылка bookmarkmarklet:

http://www.latentmotion.com/how-to-use-firebug-in-ie6-and-all-other-browsers/

Прежде чем я нашел поджигатель облегченный, я начал на моей собственной версии:

http://latentmotion.com/jquery-bookmarklet/

(Примечание: нажмите «Открыть границы окна», а затем щелкните по тегу html на странице. Вы увидите, что свойства стиля отображаются справа, а также могут использоваться как букмарклет)

Для достижения вышеуказанного букмарклета, я использовал (ссылку и массив):

http://www.latentmotion.com/jquery-bookmarklet/example-jquery-bookmarklet.js

 var allStyles = ["azimuth","background" ,"backgroundAttachment","backgroundColor","backgroundImage","backgroundPosition","backgroundRepeat","border","borderBottom","borderBottomColor","borderBottomStyle","borderBottomWidth","borderCollapse","borderColor","borderLeft","borderLeftColor","borderLeftStyle","borderLeftWidth","borderRight","borderRightColor","borderRightStyle","borderRightWidth","borderSpacing","borderStyle","borderTop","borderTopColor","borderTopStyle","borderTopWidth","borderWidth","bottom","captionSide","clear","clip","color","content","counterIncrement","counterReset","cssFloat","cue","cueAfter","cueBefore","cursor","direction","display","elevation","emptyCells","font","fontFamily","fontSize","fontSizeAdjust","fontStretch","fontStyle","fontVariant","fontWeight","height","left","letterSpacing","lineHeight","listStyle","listStyleImage","listStylePosition","listStyleType","margin","marginBottom","marginLeft","marginRight","marginTop","markerOffset","marks","maxHeight","maxWidth","minHeight","minWidth","orphans","outline","outlineColor","outlineStyle","outlineWidth","overflow","padding","paddingBottom","paddingLeft","paddingRight","paddingTop","page","pageBreakAfter","pageBreakBefore","pageBreakInside","pause","pauseAfter","pauseBefore","pitch","pitchRange","playDuring","position","quotes","richness","right","size","speak","speakHeader","speakNumeral","speakPunctuation","speechRate","stress","tableLayout","textAlign","textDecoration","textIndent","textShadow","textTransform","top","unicodeBidi","verticalAlign","visibility","voiceFamily","volume","whiteSpace","widows","width","wordSpacing","zIndex"]; 

Если кто-нибудь знают лучший способ, я заинтересован услышать это тоже :)

+0

Это интересный материал, хотя главным моментом в моем вопросе был заявленный или вычисленный аспект. Лучший способ - написать парсер CSS и обработать доступные таблицы стилей. К сожалению, это, похоже, не подходит для пользовательских (или, я думаю, пользовательских) таблиц стилей. –

+0

Да. Следующим шагом в скрипте явилось создание iframe со всеми элементами html в нем, затем получить их стили, а затем выполнить diff в отношении стилей сфокусированного элемента dom. Если есть лучший способ, я тоже хотел бы знать, что это такое. – Matrym

Смежные вопросы