首页 / JAVASCRIPT / 将样式值设置为Javascript变量

将样式值设置为Javascript变量

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了将样式值设置为Javascript变量，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含833字，纯文字阅读大概需要2分钟。

内容图文

我试图创建一个文本出现在随机位置的页面.为此,我需要随机创建包含文本的DIV中的左侧和顶部距离.以下HTML是我正在考虑的基本概念.

<body>
    <script>
        function myFunction() {
            var leftvar = Math.round(Math.random()*1000);
            var topvar = Math.round(Math.random()*1000);
        }
        window.onload = myFunction;
    </script>
    <div style="left:leftvar; top:topvar;">
        <p>Test</p>
    </div>
</body>

如何将变量放在DIV的样式CSS中？

此外,任何其他方式来随机重新定位DIV将不胜感激.

解决方法:

使用javascript获取元素并更改其样式属性：

<head>
    <style>#myDiv {position: relative;}</style>
</head>
<body>
    <script>
        function myFunction() {
            var leftvar = Math.random()*1000;
            var topvar = Math.random()*1000;

            var elem = document.getElementById('myDiv');

            elem.style.left = leftvar + 'px';
            elem.style.top  = topvar + 'px';            
        }
        window.onload = myFunction;
    </script>
    <div id="myDiv">
        <p>Test</p>
    </div>
</body>

内容总结

以上是互联网集市为您收集整理的将样式值设置为Javascript变量全部内容，希望文章能够帮你解决将样式值设置为Javascript变量所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端

扫描二维码推送至手机访问。

本文链接：https://qyyshop.com/info/732013.html

来源：【匿名】