Question

我收到了错误消息

＆＃34;未捕获的TypeError：无法设置属性＆＃39; cssText＆＃39;未定义＆＃34;

我的代码：

如何在javascript中使用var div = $('.postImg2') var img = $('.postInner2'); var divAspect = 20 / 50; var imgAspect = img.height / img.width; if (postData.files != null) { // if attached images or videos exist for (var i = 0; i < postData.files.length; i++) { if(postData.files.length == 1){ postView = postView + "<div class='postImg1'><img class='postInner1' src='img_timeline/" + postData.files[i].url + "'></div>" } else if(postData.files.length == 4){ if(imgAspect <= divAspect){ var imgWidthActual = div.offsetHeight / imgAspect; var imgWidthToBe = div.offsetHeight / divAspect; var marginLeft = -Math.round((imgWidthActual-imgWidthToBe)/2); postView = postView + "<div class='postImg2'><img class='postInner2' src='img_timeline/" + postData.files[i].url + "'></div>" img.style.cssText = 'margin-left:'+marginLeft+'px;' } else { img.style.cssText = 'margin-left:0;' } } else if (postData.files.length > 4){ postView = postView + "<div class='postImg3'><img class='postInner3' src='img_timeline/" + postData.files[i].url + "'></div>" } } }？

Answer 1

这是cssText如何工作的一个非常基本的例子。我怀疑你的img变量没有设置或引用了一个不存在的元素。

无论如何，img.style未定义。

更新要说明如何在jQuery中执行此操作（但为什么不使用.css或.attr而不是将纯JS与jQuery混合和匹配？< / p>

＆＃13;

var img = $('.postInner2');
// Get the first element from the jQuery array and apply a style with cssText.
img[0].style.cssText = "width:100px;";

/**
 * A better solution would be ".css" because it will apply to
 * ALL elements with class .postInner2 without having to loop
 */

// $(".postInner2").css({width:"100px", marginLeft: "10px"});

/**
 * Or if you have to override everything in the class:
 */

// $(".postInner2").attr("css","width:100px;margin-left:10px");

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<img class="postInner2" src="//placehold.it/400x200" alt="Placeholder" />

＆＃13;

Edit2：实际上，根据您更新的代码，它似乎无法正常工作。你试图在它甚至存在于DOM中之前获取和操作你的图像，例如：div.offsetHeight / divAspect其中实际div实际上只在下一行描述，而不是在任何地方添加到HTML中。

我认为您将不得不重新考虑代码中的逻辑流程。

Answer 2

你遇到的问题是你有一个jQuery对象，你的行为就像是DOM。

img.get(0).style.cssText = 'margin-left:0;'
//or
img[0].style.cssText = 'margin-left:0;'

但为什么要使用cssText？似乎更好做

img[0].style.marginLeft = "0px";

或者因为你正在使用jQuery

img.css("marginLeft", "0px")

在完成之后它仍然无效。原因是您在将元素添加到页面之前选择该元素。 $('.postInner2');不会在循环中选择您添加到页面中的图像，因为您在添加之前选择了该图像。实际上，在将postView附加到页面之前，您无法更新宽度并选择元素。

Answer 3

替换此

img.style.cssText = 'margin-left:'+marginLeft+'px;'

有了这个

img.css('margin-left',marginLeft+'px')

我如何使用＆＃39; cssText＆＃39;在JavaScript中？

3 个答案: