jsdom和jquery修改dom元素的css样式答案

【问题标题】：jsdom and jquery modifying css style of dom elementsjsdom和jquery修改dom元素的css样式
【发布时间】：2012-11-15 11:33:21
【问题描述】：

我一直在我的 node.js 服务器上使用 jdom 和 jquery，并通过以下代码观察到以下奇怪行为：

var divs = window.$('div').each(function() {
              //console.log(" -", $(this));
              $(this).css('background-color','green');
              $(this).addClass('sel');
              this.style.backgroundColor = "green";
            });

我尝试使用我能想到的所有方式在 html 页面上的 div 中添加一些样式（背景颜色为绿色）。以上所有的尝试（我也一一试了，看有没有独立工作）产生了相同的结果，相当于：<div id="somedivid" style="">

我想知道这是否是一个错误，因为它不会向其中写入任何样式（引号内始终为空），但如果您检查原始文档，则在这些 div 之前没有样式属性时添加样式属性。将我在页面顶部手动创建的类 sel 添加到自定义 css 样式块中确实可以工作，但是，就像您认为的那样。问题是我真的希望能够在使用 jsdom 时动态更改单个对象的样式。如果这是一个错误或我忽略了什么，任何人有任何想法？

顺便说一句，这段代码在运行标准 jquery 的普通浏览器中运行良好，正如预期的那样，所以它似乎很可能是 jsdom 实现。

【问题讨论】：

标签： jquery node.js jsdom

【解决方案1】：

你错过了一种方法......也许这个方法有效：

this.setAttribute('style', 'background-color: green;');

或：

this.setAttribute('class', 'sel');

如果 'sel' 类之前已定义，则为后者。

如果它有效，则可能意味着“jsdom”没有序列化当前计算的样式，而只是已解析的样式（在 HTML 标记中）。我相信这是预期的行为。

【讨论】：