Question

设置使用jquery自动创建的缩略图/图像的宽度时遇到了麻烦。

这是jQuery文件的代码：

                var span = document.createElement('span');
                a.appendChild(span); 
                                var img = document.createElement('img');
                img.setAttribute('src',(entry.thumbnail ? entry.thumbnail.hqDefault : ''));
                span.appendChild(img);
                var em = document.createElement('em');
                span.appendChild(em);

你可以看到正在创建一个img，我可以在我的html上看到firebug，就像这样：

<a class="clip" style="cursor: pointer;">
<span>
<img src="http://i.ytimg.com/vi/iN9a273LvaQ/hqdefault.jpg">
<em></em>
</span>
</a>

如何在不影响我网站上的所有其他图像的情况下将此图像指定为宽度？我可以在样式表中设置最大宽度，但这会改变我所有图像的大小，我不希望这样。如果有人可以帮助我，我会很高兴...

我查看了代码中的其他样式元素，我发现了这个：

var iframe = document.createElement('iframe');
            iframe.setAttribute('id', cfg.block+'Player');
            iframe.setAttribute('type', 'text/html');
            iframe.setAttribute('width', cfg.width);

（...）

    if(!this.cfg.width){
                    this.cfg.width = 200;
                }

我想它必须是这样的，但当我尝试做同样的事情时，它对我不起作用，删除cfg并用img替换它。

Answer 1

将id属性添加到创建的图像

var img = document.createElement('img');
img.setAttribute('src',(entry.thumbnail ? entry.thumbnail.hqDefault : ''));
img.setAttribute('id', 'myImage');

并以你的风格

#myImage {width: 200px;}

Answer 2

您可以直接在图像元素上设置宽度：

var img = new Image();
img.src = ...;
img.width = 200;

请注意，几乎不需要在DOM元素上使用setAttribute，只需设置所需的属性即可。

如果事实证明您无法修改所引用的代码，但可以在以后访问DOM，请使用此jQuery：

$('a.clip > span > img').attr('width', 200);

这只会影响使用原始代码段创建的图片。

如何设置jquery创建内容的图像宽度

2 个答案: