我知道我可以通过JavaScript 设置 CSS值,例如:
document.getElementById('image_1').style.top = '100px';
但是,我可以获得当前特定的样式值吗？我已经阅读了我可以获得元素的整个样式的地方,但是如果我不需要,我不想要解析整个字符串.
我在javascript中制作一个简单的手风琴菜单.我希望能够通过css max-height和min-height值为元素设置紧凑和扩展的高度.出于某种原因,当我尝试在javascript中检索元素的最小高度和最大高度以用于动画时,我得到一个空字符串,而不是像它应该的那样"500px".max-height值在css中设置,例如
#id {
min-height: 40px;
max-height: 500px;
}
全部设置,但是当我在我的javascript中放置一个调试机制时,
alert( item.style.minHeight );
它会弹出一个空的警告框.这种情况发生在Firefox 3.6.2和IE 8中.有人知道为什么javascript拒绝能够获得元素的minHeight和maxHeight吗？
我有一个带有内联样式的段落，如下所示：
<p style="font-family:georgia,garamond,serif;">
我的问题是，有没有办法找出我的页面正在使用哪种字体以及选择过程是什么？
在示例中，我必须单击两次才能看到 Foo 内容，但只需单击一次才能看到 Bar 内容。唯一的区别是 Foo 内容具有内部样式，而 Bar 具有内联样式。
<html>
<head>
<style>
.content {
display: none;
}
</style>
<script>
function showHide(element) {
sibling = element.nextElementSibling;
if (sibling.style.display == "none")
sibling.style.display = "block"
else sibling.style.display = "none";
}
</script>
</head>
<body>
<h1 onclick="showHide(this)">Foo</h1>
<div class="content">
Foo Content
</div>
<h1 onclick="showHide(this)">Bar</h1>
<div style="display: none;">
Bar Content
</div>
</body>
</html>你可以在 jsfiddle 中看到这段代码
我想使用内部 css 或外部 css，但具有与内联 css 相同的行为，这可能吗？我想这是一个基本主题，但我不知道该使用什么概念来更深入。
我有一个关于通过javascript获取DOM样式的问题.
#quicklink {
position: absolute;
top: 500px;
left: 500px;
}
<div id="quicklink" class="draggable">
<img class="menu_icon" src="4a.png" src="" />
</div>
当我试图通过这个代码获得元素的顶部.为什么它总是有空字符串值？
var quicklink = document.getElementById('quicklink');
console.log(quicklink.style.top); // string value ???
谢谢!
我在div里面有一个复选框.
<div id="question_text_1">
<input type="checkbox" onChange="myFunction(question_text_1)">Sample question text
</div>
我正在尝试切换div选中或取消选中复选框时的背景颜色,这不起作用.
这是完整的代码
但是,在没有切换逻辑的情况下实现相同的代码工作正常 - 链接
请建议可能出现的问题.
我试图通过更改 div 的样式属性来显示 btn 的 div onclick。但我无法读取该 div 的显示属性。我在某处读到代码不起作用，因为脚本试图在 div 加载之前获取值，因此应该在 window.onload 之后触发脚本。如何在窗口加载后但仅在单击按钮时使脚本工作？
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
#hidden-div{
display: none;
}
</style>
<script type="text/javascript">
function showMe() {
var foo = document.getElementById('hidden-div');
alert(foo.style.display); //this gives a blank alert
if(foo.style.display == ''){
foo.style.display = 'block';
}
else {
foo.style.display == 'none';
}
}
</script>
</head>
<body>
<input type="button" id="btn-me" onclick="showMe()">+ clicking here should display the checkboxes</input><br>
<div id="hidden-div">
<input type="checkbox" id="check-1"> Check 1</input>
<br>
<input type="checkbox" id="check-2"> Check 2</input>
<br> …当我的 html 和 JS 代码在同一个文件中时，我有点不确定为什么我的代码似乎不起作用。当 html 和 JS 分开时，似乎工作正常。有人可以指出我的错误......我是新手！！
HTML：
<div class="main">
<div class="light"></div>
<button onclick="chngCol()" id="burn">Burn!</button>
</div>
JavaScript：
chngCol() {
if(document.getElementByClass('light').style.background == "#00ffff")
{
document.getElementByClass('light').style.background = "#ffff00";
}
else if(document.getElementByClass('light').style.background == "ffff00")
{
document.getElementByClass('light').style.background = "#ff00ff";
}
else if(document.getElementByClass('light').style.background == "#ff00ff")
{
document.getElementByClass('light').style.background = "#00ffff";
}
}
CSS：
.light{
width: 50px;
height: 50px;
background-color:#00ffff;
}
所有代码都在带有适当标签的同一个文档中，但是在调用 chngCol.h 后，我在第一个 { 时在 Chrome 控制台中遇到了错误。
我正在做一些我需要返回元素样式并在HTML页面中打印它的东西.好吧我知道如何打印它,但问题是如何获得元素.测试它是否会打印我试过的样式
console.log(document.getElementById('something').style.fontSize);
但它返回undefined,即使'something'确实有一个设置的字体大小.