Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 20.05.2010, 15:12
Аватар для Skipp
.
Отправить личное сообщение для Skipp Посмотреть профиль Найти все сообщения от Skipp
 
Регистрация: 30.03.2010
Сообщений: 1,813

Работа с объектом style (CSSStyleDeclaration)
Появился такой вопрос:
Есть объект, допустим:

styleList: {
		height: "5px",
		borderColor: "#000000",
                border: "1px solid #000000"
                //.......
	}


И есть какой-нибудь элемент на странице, допустим <div>.

Какими способами можно синхронизовать выше упомянутый объект с объектом style элемента на странице.

Надеюсь понятно написал
И просьба без jquery.
Заранее спасибо!
__________________
.
Ответить с цитированием
  #2 (permalink)  
Старый 20.05.2010, 15:14
Профессор
Отправить личное сообщение для exec Посмотреть профиль Найти все сообщения от exec
 
Регистрация: 21.01.2010
Сообщений: 1,022

for (var i in styleList) {
node.style[i] = styleList[i];
}
Ответить с цитированием
  #3 (permalink)  
Старый 20.05.2010, 15:17
Аватар для Skipp
.
Отправить личное сообщение для Skipp Посмотреть профиль Найти все сообщения от Skipp
 
Регистрация: 30.03.2010
Сообщений: 1,813

а ещё есть предложения?
Вышеупомянутый уже рассматривал
__________________
.

Последний раз редактировалось Skipp, 20.05.2010 в 15:24.
Ответить с цитированием
  #4 (permalink)  
Старый 20.05.2010, 15:37
Профессор
Отправить личное сообщение для exec Посмотреть профиль Найти все сообщения от exec
 
Регистрация: 21.01.2010
Сообщений: 1,022

А чем Вам не нравится этот?

Другие варианты врядли найдутся, работа с хэшами возможна только через for…in.
Ответить с цитированием
  #5 (permalink)  
Старый 20.05.2010, 15:45
Аватар для Skipp
.
Отправить личное сообщение для Skipp Посмотреть профиль Найти все сообщения от Skipp
 
Регистрация: 30.03.2010
Сообщений: 1,813

Да не то что бы это не нравилось, чистой воды любопытство
__________________
.
Ответить с цитированием
  #6 (permalink)  
Старый 21.05.2010, 08:23
Аспирант
Отправить личное сообщение для autosoft Посмотреть профиль Найти все сообщения от autosoft
 
Регистрация: 23.08.2008
Сообщений: 30

Может не с той стороны, но зачем вообще нужен этот "объект styleList"?

Читать стиль так:
var css

if (element.currentStyle) css = element.currentStyle
else
if (window.getComputedStyle) css = window.getComputedStyle(element, null)

if (css != undefined) {

   // css ...
}


Запись соответственно:
element.style[param] = value

И синхронизировать ничего вроде бы не нужно.
var get_style = function (element) {

    var css

    if (element.currentStyle) css = element.currentStyle
    else
    if (window.getComputedStyle) css = window.getComputedStyle(element, null)

    return css
}

var get_style_param = function (element, param) {

    var css = get_style(element)

    param = param.replace(/-\D/g, function (match) { return match.charAt(1).toUpperCase() })

    return css ? css[param] : null
}

var set_style_param = function (element, param, value) {

    param = param.replace(/-\D/g, function (match) { return match.charAt(1).toUpperCase() })

    element.style[param] = value
}

Оно?
Ответить с цитированием
  #7 (permalink)  
Старый 21.05.2010, 09:21
Аватар для Skipp
.
Отправить личное сообщение для Skipp Посмотреть профиль Найти все сообщения от Skipp
 
Регистрация: 30.03.2010
Сообщений: 1,813

Ваш метод намного громоздкий и скажу что он намного медленней чем предыдущий Уж извините.

С объектом проще работать чем с любым другим.

Так же как я понимаю, доступ к объекту так же осуществляется быстрее и проще, чем чем...., да тут всё на объектах, наверно не зря

А вообще, всё равно спасибо.
__________________
.
Ответить с цитированием
  #8 (permalink)  
Старый 21.05.2010, 10:00
Отправить личное сообщение для Octane Посмотреть профиль Найти все сообщения от Octane  
Регистрация: 10.07.2008
Сообщений: 3,873

[offtop]Столько всего интересного вытаскивается из ComputedCSSStyleDeclaration в Fx 3.6
body {
	background-attachment: scroll;
	background-color: rgb(0, 75, 82);
	background-image: none;
	background-position: 0% 0%;
	background-repeat: repeat;
	border-bottom-color: rgb(0, 0, 0);
	border-bottom-style: none;
	border-bottom-width: 0px;
	border-collapse: separate;
	border-left-color: rgb(0, 0, 0);
	border-left-style: none;
	border-left-width: 0px;
	border-right-color: rgb(0, 0, 0);
	border-right-style: none;
	border-right-width: 0px;
	border-spacing: 0px 0px;
	border-top-color: rgb(0, 0, 0);
	border-top-style: none;
	border-top-width: 0px;
	bottom: auto;
	caption-side: top;
	clear: none;
	clip: auto;
	color: rgb(0, 0, 0);
	content: none;
	counter-increment: none;
	counter-reset: none;
	cursor: auto;
	direction: ltr;
	display: block;
	empty-cells: show;
	float: none;
	font-family: verdana,geneva,lucida,lucida grande,arial,helvetica,sans-serif;
	font-size: 13.3333px;
	font-size-adjust: none;
	font-stretch: normal;
	font-style: normal;
	font-variant: normal;
	font-weight: 400;
	height: 3785.2px;
	left: auto;
	letter-spacing: normal;
	line-height: 16px;
	list-style-image: none;
	list-style-position: outside;
	list-style-type: disc;
	margin-bottom: 0px;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 0px;
	marker-offset: auto;
	max-height: none;
	max-width: none;
	min-height: 0px;
	min-width: 0px;
	ime-mode: auto;
	opacity: 1;
	outline-color: rgb(0, 0, 0);
	outline-style: none;
	outline-width: 0px;
	outline-offset: 0px;
	overflow: visible;
	overflow-x: visible;
	overflow-y: visible;
	padding-bottom: 0px;
	padding-left: 0px;
	padding-right: 0px;
	padding-top: 0px;
	page-break-after: auto;
	page-break-before: auto;
	pointer-events: auto;
	position: static;
	quotes: \\u201C\ \\u201D\ \\u2018\ \\u2019\;
	right: auto;
	table-layout: auto;
	text-align: start;
	text-decoration: none;
	text-indent: 0px;
	text-shadow: none;
	text-transform: none;
	top: auto;
	unicode-bidi: embed;
	vertical-align: baseline;
	visibility: visible;
	white-space: normal;
	width: 1287px;
	word-spacing: 0px;
	z-index: auto;
	-moz-appearance: none;
	-moz-background-clip: border;
	-moz-background-inline-policy: continuous;
	-moz-background-origin: padding;
	-moz-background-size: auto auto;
	-moz-binding: none;
	-moz-border-bottom-colors: none;
	-moz-border-image: none;
	-moz-border-left-colors: none;
	-moz-border-right-colors: none;
	-moz-border-top-colors: none;
	-moz-border-radius-bottomleft: 0px;
	-moz-border-radius-bottomright: 0px;
	-moz-border-radius-topleft: 0px;
	-moz-border-radius-topright: 0px;
	-moz-box-align: stretch;
	-moz-box-direction: normal;
	-moz-box-flex: 0;
	-moz-box-ordinal-group: 1;
	-moz-box-orient: horizontal;
	-moz-box-pack: start;
	-moz-box-shadow: none;
	-moz-box-sizing: content-box;
	-moz-column-count: auto;
	-moz-column-width: auto;
	-moz-column-gap: 13.3333px;
	-moz-column-rule-color: rgb(0, 0, 0);
	-moz-column-rule-width: 0px;
	-moz-column-rule-style: none;
	-moz-float-edge: content-box;
	-moz-force-broken-image-icon: 0;
	-moz-image-region: auto;
	-moz-outline-radius-bottomleft: 0px;
	-moz-outline-radius-bottomright: 0px;
	-moz-outline-radius-topleft: 0px;
	-moz-outline-radius-topright: 0px;
	-moz-stack-sizing: stretch-to-fit;
	-moz-transform: none;
	-moz-transform-origin: 50% 50%;
	-moz-user-focus: none;
	-moz-user-input: auto;
	-moz-user-modify: read-only;
	-moz-user-select: auto;
	-moz-window-shadow: default;
	word-wrap: normal;
	clip-path: none;
	clip-rule: nonzero;
	color-interpolation: srgb;
	color-interpolation-filters: linearrgb;
	dominant-baseline: auto;
	fill: rgb(0, 0, 0);
	fill-opacity: 1;
	fill-rule: nonzero;
	filter: none;
	flood-color: rgb(0, 0, 0);
	flood-opacity: 1;
	lighting-color: rgb(255, 255, 255);
	image-rendering: auto;
	mask: none;
	marker-end: none;
	marker-mid: none;
	marker-start: none;
	shape-rendering: auto;
	stop-color: rgb(0, 0, 0);
	stop-opacity: 1;
	stroke: none;
	stroke-dasharray: none;
	stroke-dashoffset: 0px;
	stroke-linecap: butt;
	stroke-linejoin: miter;
	stroke-miterlimit: 4;
	stroke-opacity: 1;
	stroke-width: 1px;
	text-anchor: start;
	text-rendering: auto;
}
[/offtop]
Ответить с цитированием
  #9 (permalink)  
Старый 21.05.2010, 10:23
Аватар для Skipp
.
Отправить личное сообщение для Skipp Посмотреть профиль Найти все сообщения от Skipp
 
Регистрация: 30.03.2010
Сообщений: 1,813

Интересто, а как вы получили данные?
__________________
.
Ответить с цитированием
  #10 (permalink)  
Старый 21.05.2010, 10:31
Отправить личное сообщение для Octane Посмотреть профиль Найти все сообщения от Octane  
Регистрация: 10.07.2008
Сообщений: 3,873

var i, styles = getComputedStyle(document.body, null), css = [];
for (i = 0; i < styles.length; i++) {
    css.push(styles[i] + ": " + style.getPropertyValue(styles[i]));
}
alert(css.join(";\n"));
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Присваивание style с помощю javascript Peresmeshnik Общие вопросы Javascript 4 28.02.2010 21:49
Kak opredelit current link i dat novi style, onclick, help armdev Events/DOM/Window 6 04.10.2009 19:03