javascript - jquery的append()无法正确设置元素的style？

问题描述

问 题

具体来说，我试图写一个CHROME拓展修改EXHENTAI的页面，免去翻页的事，为此，我想添加类如这样的DOM元素
<div class=gdtm style=height:162px><div style = margin:1px auto 0; width:100px; height:142px; background:transparent url(http://95.211.149.120/m/00097... -200px 0 no-repeat><img alt=43 title=Page 43: 999_184r.jpg src=https://exhentai.org/img/blan... style=width:100px; height:141px; margin:-1px 0 0 -1px></div></div>
加粗的部分实际上就是用于显示略缩图的style。这个内容是直接从网页上复制过来的，所以只要能原本地加在页面上，应该是能正常显示的。

不过重点在于，一旦我这样做：
$("#gdt").append("<div class=gdtm style=height:162px><div style = margin:1px auto 0; width:100px; height:142px; background:transparent url(http://95.211.149.120/m/00097... -200px 0 no-repeat><img alt=43 title=Page 43: 999_184r.jpg src=https://exhentai.org/img/blan... style=width:100px; height:141px; margin:-1px 0 0 -1px></div></div>")
（当然，上面的内容本来应该有一堆变量，我已经替换成了实际值。）

加粗的部分实际上会变成这样的元素：
<div style="margin:1px" auto="" 0;="" width:100px;="" height:142px;="" background:transparent="" url(http:="" 95.211.149.120="" m="" 000977="" 977835-02.jpg)="" -200px="" 0="" no-repeat=""><img alt="43" title="Page" 43:="" 999_184r.jpg="" src="https://exhentai.org/img/blan... style="width:100px;" height:141px;="" margin:-1px="" 0="" -1px=""></div>

请问有什么办法能修正吗？

已解决：确实加个引号就行了，不过对于变量不能直接这样做，但通过两次字符串替换也能解决问题。

解决方案

你把style里面的样式的值加个引号看看

这篇关于javascript - jquery的append()无法正确设置元素的style？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！