Как получить размер div из style?
Вместо ширины в консоль выводится "ничего".
window.onload = function()
{
var map = document.getElementById("map");
console.log(map.style.width);
}
Ширину в пикселях можно получить из map.clientWidth, но чисто теоретически, объясните, пожалуйста, почему из стиля нельзя? |
Riddik, наверное, потому что у Вас не задана ширина через стили.
<div onclick="alert(this.style.width)" style="width:200px">Click me</div> <div onclick="alert(this.style.width)">Click me</div> |
Задана в css файле, это имеет значение?
#map
{
position: relative;
display: block;
width: 600px;
height: 773px;
}
<div id="map"></div> Не выводит ничего... |
map.style.widthи пр. работают в JS, только если они были заданы и изменены через JS |
alexan0308,
Учту, спасибо) |
<!DOCTYPE HTML>
<html>
<head>
<style>
.divo-divnoe {
width: 100px;
height: 100px;
border: 1px solid #666;
background: #dbdbdb;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
</head>
<body>
<div class="divo-divnoe">click me!</div>
<script>
$(function() {
$('.divo-divnoe').on('click', function() {
alert($(this).width() + ' пикселей в ширину');
alert($(this).css('width') + ' в ширину');
});
});
</script>
</body>
</html>
|
Цитата:
<div id="divo-divnoe" style="width: 100px; height: 100px; border: 1px solid #666; background: #dbdbdb;">click me!</div>
<script>
document.getElementById('divo-divnoe').onclick = function(){
alert(this.style.width + ' в ширину');
}
</script>
Правильнее было бы сказать, что .style.width берет стили, которые заданы в инлайне. А jQuery умеет добираться до таблицы. |
BETEPAH,
Спасибо! На "голом" javascript тоже можно, ведь jQuery просто удобная обёртка. |
<!DOCTYPE HTML>
<html>
<head>
<style>
#map {
width: 200px;
}
</style>
</head>
<body>
<div id="map">Map</div>
<script>
window.onload = function () {
var map = getComputedStyle(document.getElementById('map'), '');
alert(map.width);
}
</script>
</body>
</html>
|
Цитата:
|
| Часовой пояс GMT +3, время: 17:13. |