这似乎在 FF、Opera、IE (10) 甚至 chrome 中都可以正常工作，但 safari 却没有？
<html> <head>
<style> .moveable_image {position:absolute; top:50px;} </style>
<script type="text/javascript">
function move_image() {
var image_top = 200
document.styleSheets[0].cssRules[0].style.top = image_top;
} </script>
</head> <body>
<input type='button' onClick='move_image()' value='move image'/>
<img class="moveable_image" src="f/4thumb.jpg">
</body> </html>
它是这样工作的:
document.styleSheets[0].cssRules[0].style.top = "200px"
但在调用“var”时不是吗？
如果我(可以)走名称路线，它可以调用相同的 var:
document.images['moveable'].style.top = image_top;
但我需要改变整个类(class)
这是直播:http://generationsinc.co.uk/test/safari_java_cssrule_test.html
我希望这是有道理的，我根本无法找到任何内容。我什至刚刚重新安装了 Safari...
我意识到为什么我需要以这种特定方式实现这一点并不明显，但那是因为我已经从元素的核心中剔除这种烦恼并尽可能简单地呈现它。
伙计们，我有哪些选择？
编辑；在浏览器上似乎有更多的不兼容性，只有一点点旧......请参阅我的评论。
有没有我错过的更好的方法来动态更改整个类的元素？
或者仅仅是一大堆元素？
最佳答案
您可以使用 jquery 设置 css 属性 top: 200px;。看到这段代码-
<!DOCTYPE html>
<html> <head>
<style>
.moveable_image {position:absolute; width: 100px ; top:50px;}
</style>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript">
function move_image() {
$('.moveable_image').css({"top":"200px"});
} </script>
</head> <body>
<input type='button' onClick='move_image()' value='move image'/>
<img class="moveable_image" src="Tupils.jpg">
</body> </html>
这适用于 IE、Chrome 和 Safari。
关于javascript - 为什么 Safari 不能管理这个动态的 css Style，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/17299202/