获取/迭代不在对象中的属性 [英] Get/iterate over properties that are not in object

问题描述

根据这个问题，我需要努力如果一个属性不在一个对象中：

所以，我们有一些样式：

pre> .foo {
top：13px;
width：37px;

$ / code $ / pre



...和这样一个对象：

  var keyframe = {
 0：{
 top：0 
}，
 1000：{
 top：100 
}，
 2000：{
 width：100 
} 
}; 
  

现在我需要遍历所有不在下一个/前一个 / em> -item，用一个jQuery对象的css-value填充缺失的属性。

这样最终的对象看起来像这样：

  var keyframe = {
 0：{
 top：0，
 width：'37px'
 $，
 1000：{
 top：100，
 width：'37px'
}，
 2000：{
 top：100，
 width：100 
} 
}; 
  

我试过这样的事情：

http://fiddle.jshell.net/WdNge/

  var $ foo = $（'。foo'）; 
 for（var key in keyframe）{
 var obj = keyframe [key]; 
 for（var ok in obj）{
 if（！（ok in obj））obj [ok] = $ foo.css（ok）; 
 
 
  

似乎

  if（！（ok in obj））//总是`truthy` 
  

然而，如果我直接声明它

  if （！（顶部）在obj））//它的工作原理... 
  

有什么想法吗？ / b>

更新

我甚至尝试过这样的事情，但没有成功： p>

http://fiddle.jshell.net/ WdNge / 1 /

  var $ foo = $（'。foo'）; 
 var keys = []; 
 for（var key in keyframe）{
 var obj = keyframe [key]; 
 var k = Object.keys（obj）; 
 keys.push（k [0]）; 
 for（var i = 0; i< keys.length; i ++）{
 var ok = keys [i]; 
 if（！（ok obj））obj [ok] = $ foo.css（ok）; 
 
 
 $ / code $ / pre 
 
解决方案
 AFAIK你不能从使用jQuery / Javascript的类中提取指定的CSS属性。
 
 
 
这意味着你必须存储 .foo 在您的Javascript中单独作为JSON的类规范或者b）遍历jQuery知道的所有CSS属性。
 
 $ b 
 CSS 
  .foo {
 top：0; 
 width：100px; 
 
 code 
 
 $ b $ p 
 
 $ pre $  var foo_styles = {top：0，width：100px}，
 keyframe = {
 0：{
 top：0 
} ，
 1000：{
 top：100 
}，
 2000：{
 width：100 
} 
}; 
 for（var key in keyframe）{
 var frame = keyframe [key]; 
 for（var frameProperty in foo_styles）{
 if（！（frameProperty in frame））{
 frame [frameProperty] = foo_styles [frameProperty]; 
} else {
 //用关键帧的最后一个值更新
 foo_styles [frameProperty] = frame [frameProperty]; 
} 
} 
} 
  
 
According to this question, I need to chek if a property is not in an object:


So, we've some styling:
.foo {
    top: 13px;
    width: 37px;
}
...and an object like this one:
var keyframe = {
    0: {
        top: 0
    },
    1000: {
        top: 100
    },
    2000: {
        width: 100
    }
};
now I need to iterate over all properties that are not in the next/previous frame-item, to populate the missing property with the css-values from an jQuery-object.

So that the final object looks like this:
var keyframe = {
    0: {
        top: 0,
        width: '37px'
    },
    1000: {
        top: 100,
        width: '37px'
    },
    2000: {
        top: 100,
        width: 100
    }
};
I've tried something like this:

http://fiddle.jshell.net/WdNge/
var $foo = $('.foo');
for (var key in keyframe) {
    var obj = keyframe[key];
    for(var ok in obj) {
        if (!(ok in obj)) obj[ok] = $foo.css(ok);
    }
}
But it seems that
if (!(ok in obj)) // is always `truthy`
however if I declare it directly
if (!('top' in obj)) // it works...
Any ideas?

Update

I even tried something like this, but no success:

http://fiddle.jshell.net/WdNge/1/
var $foo = $('.foo');
var keys = [];
for (var key in keyframe) {
    var obj = keyframe[key];
    var k = Object.keys(obj);
    keys.push(k[0]);
    for(var i = 0; i < keys.length; i++) {
        var ok = keys[i];
        if (!(ok in obj)) obj[ok] = $foo.css(ok);
    }
}

解决方案
AFAIK you can't extract the specified CSS properties from a class using jQuery/Javascript.

That means that you'll have to a) store the .foo class specification separately as JSON within your Javascript or b) iterate over all CSS properties that jQuery is aware of.

CSS
.foo {
    top: 0;
    width: 100px;
}
Javascript
var foo_styles = { top: 0, width: "100px" },
    keyframe = {
    0: {
        top: 0
    },
    1000: {
        top: 100
    },
    2000: {
        width: 100
    }
};
for (var key in keyframe) {
    var frame = keyframe[key];
    for(var frameProperty in foo_styles) {
        if (!(frameProperty in frame)) {
            frame[frameProperty] = foo_styles[frameProperty];
        } else {
            // Update with last value from keyframe
            foo_styles[frameProperty] = frame[frameProperty];
        }
    }
}


                        
这篇关于获取/迭代不在对象中的属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！