当使用element.style = <some cssstyledeclaration =“”>使元素消失时

时间:2016-07-06 18:33:49

标签: javascript css dom typescript angular

我用,(请不要介意选择器,我知道它应该被改变,但它仍然被发现)。

format(strptime('02FEB2015:00:06:00.000000', "%d%b%Y:%H:%M:%S"), "%M:%S")
# [1] "06:00"

然后我用:

 let leftArrow = <HTMLElement> document
  .querySelector('div[style="position: absolute; left: 6px; transform: skewX(22.6deg);' +
    ' transform-origin: 0px 0px 0px; height: 24px; width: 10px;' +
    ' box-shadow: rgba(0, 0, 0, 0.6) 0px 1px 6px; background-color: rgb(255, 255, 255);"]');

但是当我这样做时:

let myStyle = leftArrow.style; //this gets me a CSSStyleDeclaration object
console.log(myStyle);         // those are equal objects
console.log(leftArrow.style); // those are equal objects

我的元素消失了吗?!

我的目标是使用一个类,然后这样做:

leftArrow.style = myStyle; //this should change nothing ?!

但简单之后:

leftArrow.style = this.getStyleFromClass(selector_to_find_class_name);

我的元素来自上层元素:

leftArrow.style = myStyle;

这使它基本上不可见。为什么?

2 个答案:

答案 0 :(得分:1)

  

leftArrow.style = myStyle; //这应该什么都不改变?!

是的,但前提是:

let myStyle = leftArrow.style; //this gets me a CSSStyleDeclaration object
letArrow.style = myStyle;

这很可能不是您拥有的代码,而是您即时生成对象。 不要直接分配到样式。而是分配给style的成员,例如letArrow.style.color = "red"

答案 1 :(得分:0)

我认为您要做的是将原始内联样式应用回来。为此,您可以使用cssText获取值,而不是将其设置回来。

&#13;
&#13;
var div = document.getElementById("x");
var backUp = div.style.cssText;
div.style.backgroundColor = "yellow";
div.style.color = "blue";
window.setTimeout( function () {
  div.style.cssText = backUp;
}, 4000);
&#13;
<div id="x" style="background-color:red">Hello</div>
&#13;
&#13;
&#13;