Отображение стиля слоя элемента в javascript

Я пытаюсь отобразить стиль слоя div с помощью javascript. Мой JS код выглядит следующим образом:Отображение стиля слоя элемента в javascript

<body> 
<script> 
function displayStyle(objectId,styleName){ 
    var objRef=document.getElementById(objectId); 
    var styleValue=eval(objRef.style + styleName); 
    window.alert(styleName +" =" +styleValue); 
    } 

</script> 
<div id="myObject" style="position: absolute; left:50px; top: 200px; background-color: #cccccc;">My Object</div> 
<form> 
style:<input type="text" name="styleText"> 
<input type="button" value="Display Style" 
onClick="displayStyle('myObject',this.form.styleText.value);"> 
</form> 
</body>

Проблема находится на кнопку мыши, свойство стиля оленьей кожи всплывает в окне alert.The консоль показывает неперехваченного SyntaxError: Неожиданный идентификатор PLZ помощь.

источник

2015-02-16 pallavidestiny22

Вы должны использовать bracket notation

function displayStyle(objectId, styleName) { 
    var objRef = document.getElementById(objectId); 
    var styleValue = objRef.style[styleName]; 
    window.alert(styleName + " =" + styleValue); 
}

источник

2015-02-16 06:45:57

Plz вы можете объяснить, почему var styleValue = objRef.style [styleName]; и – pallavidestiny22

вы пытаетесь получить доступ к значению элемента объекта 'objRef.style', используя динамический ключ, хранящийся в переменной' styleName', для этого вы можете использовать [Операторы членов] (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Member_Operators), так как у вас есть динамический ключ [нотация скобки] (https://developer.mozilla.org/en-US/docs/Web/JavaScript/ Reference/Operators/Member_Operators # Bracket_notation) - правильный выбор –

Я действительно не рекомендую использовать Eval();

Другая проблема: вам не хватает точки в строке.

var styleValue = eval(objRef.style + '.' + styleName);

Но это будет работать только при условии, что вы также передадите действительное имя свойства стиля. Я попытался бы использовать один из подходов ниже.

Если вы хотите перейти к одному из значений свойств атрибутов стиля, вы можете просто использовать его.

function displayStyle(objectId, styleName) { 
     var objRef = document.getElementById(objectId), 
      styleValue = objRef.style.getPropertyValue(styleName); 
     window.alert(styleName +" = " +styleValue); 
    }

Другой способ - использовать синтаксис квадратной скобки. В JS вы можете получить доступ к внутренним свойствам объекта с a. как большинство языков на языке C. Но они также предоставляют вам аксессуар на основе строки.

var person = { 
    name: 'Rick' 
} 

console.log(person.name); //Rick 
console.log(person['name']); //Rick

Эта система работает с любым объектом в JS. Однако использование этого объекта Style может привести к использованию различных имен свойств.

E.G в атрибутах стиля HTML вы используете margin-left. Если вы хотите использовать это значение, используя квадратные скобки, вы должны использовать стиль ['marginLeft'];

Если вы хотите получить все свойства стиля, которые были отображены на объекте, вы также можете использовать.

window.getComputedStyle(objRef);

который возвращает вам объект свойств стиля, но с вычисленными высотами и т. Д. Но он не работает в старых браузерах.

Извините, если это не ясно, я набрал его на своем телефоне.

источник

2015-02-16 07:17:08 Rick

Отображение стиля слоя элемента в javascript

ответ

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