Question

我可以获得或设置静态定位在纯JS中的元素的坐标，宽度和高度吗？如果是 - 如何？在jQuery？

Answer 1

如果jQuery是可以接受的，你可以使用.position（）方法检索#your_element顶部和左侧位置偏移其父级。

$('#your_element').position().left
$('#your_element').position().top

和尺寸使用：

$('#your_element').width()
$('#your_element').height()

Answer 2

是的，你可以。这应该有助于您入门。

<html>
    <head>
        <script>
            function whereAmI(e){
                //Note that css styles may not be accurate, as one can see with top/left here.
                //It is just to show possibilities.

                alert(
                    'Width (css): ' + (e.style.width || '') + '\n' +
                    'Height (css): ' + (e.style.height || '') + '\n' +
                    'Left (css): ' + (e.style.left || '') + '\n' +
                    'Top (css): ' + (e.style.top || '') + '\n\n' +
                    'Width (offset): ' + e.offsetWidth.toString() + 'px\n' +
                    'Height (offset): ' + e.offsetHeight.toString() + 'px\n' +
                    'Left (offset): ' + e.offsetLeft.toString() + 'px\n' +
                    'Top (offset): ' + e.offsetTop.toString() + 'px'
                );      
            }

            function setTo5050(){
                var tE = document.getElementById('adiv');
                if (tE){
                    tE.style.height = '50px';
                    tE.style.width = '50px';
                    tE.style.left = '50%';
                    tE.style.top = '50%';
                };
            }
        </script>
    </head>

    <body>
        <div id = 'adiv' style = 'background: lime' onclick = 'whereAmI(this)'>Where am I?</div>
        <b onclick = 'setTo5050()'>Set to 50px 50px</b>
    </body>
</html>

我可以获得或设置静态定位在纯JS中的元素的坐标，宽度或高度吗？

2 个答案: