javascript - 使用 jQuery 获取页面中不存在的类/id 的 css 属性

标签 javascript jquery html css

正如标题所说。我想要这个 javascript...

$("#mrNotAppearing").css("background-color");

根据此 css 返回“红色”...

#mrNotAppearing {
    background-color: red;
}

鉴于文档中没有元素实际上具有 id mrNotAppearing

我在 jQuery 中使用媒体查询检查来获取窗口宽度,如 here 所示而且我认为使用一些绝对不会妨碍任何事情的“虚拟”CSS 可能会很好。

我也愿意接受其他能达到相同结果的建议。

B 计划,我只是使用实际的 CSS 还是向主体添加一些虚拟属性?

为清楚起见更新:

很难将需要特定窗口宽度的 javascript 与 css 中的媒体查询宽度同步,这可能会导致布局问题。

相反,您可以查询 css 本身的状态。这样:

body {
    background-color: blue;
}
@media (min-width: 42em) {
    body {
        background-color: red;
    }
}

然后,在 javascript 中:

if($(body).css("background-color")==="red"){
    // we know down to the pixel that it's safe to trigger the javascript  
    // because the media query went off.
}

我想要做的就是在 css 中添加一个虚拟条目,它将仅用于触发 javascript。我可以使用现有的属性——而且可能不得不——但我想明确说明我在做什么。或者我至少在考虑这个想法。

对于造成的困惑,我深表歉意。我是为了简洁。

附言问题的重点是使用一种 100% 不会出现在文档中的样式。并且永远不会改变,即使布局改变了也是如此。

最佳答案

编辑:哈,好的,最后的答案。 em 确实返回为 px。所以……

我要回答我自己的问题,因为我很确定这对任何人都没有意义。另外,我不知道这是否是个好主意,但它似乎适合我的目的。所以,我的解决方案:

设置 <style> 的样式标签。它在 DOM 中,不是结构化的,jQuery 可以从中获取 css 属性。像这样...

style {
    width: 672px;
}

然后……

$("style").css("width"); 

将返回 672px

我可能想多了。而且可能仍然没有意义。我不知道这是否适用于除 Chrome 之外的任何浏览器,或者出于某种原因这是否是一个糟糕的主意,但我认为它在语义上很有吸引力。

还有其他想法吗?

关于javascript - 使用 jQuery 获取页面中不存在的类/id 的 css 属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30387645/

相关文章:

javascript - 如何在jquery中获取JSON对象中的数据

javascript - document.querySelectorAll 的返回类型是什么

javascript - 如何在 PHP 中从 AJAX jQuery 请求获取数据

javascript - D3.js 图表响应行为

javascript - $ ("#myForm").attr ("action") 返回一个表单元素,而不是没有操作的表单的 undefined

html - 最后一个 child 没有按预期使用 p 标签工作

javascript - 更改状态 UI 路由后按钮消失

javascript - 使用 JavaScript 插入 HTML 元素

javascript - 我如何以编程方式更改选择,以便它触发其 onchange 行为?

javascript - Gulp 不会合并或丑化