javascript - 使用javascript获取CSS样式属性

Question

我有一张图片可拖动，想通过 PHP 保存它，所以我决定获取内部样式并将其作为输入字段中的值，这样我就可以通过 $ 获取它_POST，但我无法找到它是否是内部 HTML 数据，我可以通过调用 innerHTML 语法来获取它，但就像这样获得图像风格的任何方式

<div class="scott_img">
            <img id="uploadPreview" src="<?php echo (empty($data['profile_pic'])) ? "images/profile.jpg" : "uploads/" . $data['profile_pic']; ?>" style="style goes here">
            <span class="scouttag"></span>

        </div>
        <form method="POST" action="profile.php?uid=<?php echo $uid; ?>" enctype="multipart/form-data" style="text-align:center;">
            <input id="uploadImage" type="file" name="image" style="margin:auto;" />
            <input type="hidden" id="x" name="x" />
            <input type="hidden" id="y" name="y" />
            <input type="hidden" id="w" name="w" />
            <input type="hidden" id="h" name="h" />
            <input type="hidden" id="uploadPreview1" value="need style here so i can save it to database" />
            <button type="submit" name="update_picture" class="btn_form">Update Picture</button>
        </form> 

        <img class="scott_line"src="images/line.png">

         <script>
            (function() {
                var elem = document.getElementById('uploadPreview');
                var val  = getComputedStyle(elem);
                document.getElementById('uploadPreview1').value = val;
              var $section = $('.scott_img').first();
              $section.find('#uploadPreview').panzoom({
                $zoomRange: $section.find(".zoom-range"),
                $reset: $section.find(".reset")
              });
            })();
          </script>     

谢谢

Answer 1

if you get element style tag (inline css)

   var a = document.getElementById('uploadPreview');
    var b=  a.getAttribute('style');
    alert(b);

如果你获取元素 css

var element = document.getElementById('uploadPreview'),
    style = window.getComputedStyle(element),
    top = style.getPropertyValue('top');