Question

我有以下HTML代码：

<p>adfa</p>
<p><img src="http://localhost:27756//download.jpg" alt="" width="282" height="179" /></p>
<p>adfa</p>
<p><img src="http://localhost:27756/Summit 2013-5.jpg" alt="" width="358" height="358" /></p>
<p>adfa</p>

现在我想将每个图像的高度和宽度添加到其src中。我怎样才能做到这一点？我是jQuery的新手。

Answer 1

尝试这样的事情：

$('img').each(function() {

alert($(this).attr('src'));

$(this).css('width',500);
$(this).css('height',500);

});

如果您想添加img属性，可以这样做：

$('img').each(function(i) {

alert('OLD:Width for image at index '+i+' is '+$(this).attr('width'));
alert('OLD:height for image at index '+i+' is '+$(this).attr('height'));

$(this).attr('width',500);
$(this).attr('height',500);

alert('NEW:Width for image at index '+i+' is '+$(this).attr('width'));
alert('NEW:height for image at index '+i+' is '+$(this).attr('height'));
});

演示小提琴：https://jsfiddle.net/eqr5s9ac/

Answer 2

<!DOCTYPE html>
<html>
    <head>
        <script src="https://code.jquery.com/jquery-1.12.3.min.js" integrity="sha256-aaODHAgvwQW1bFOGXMeX+pC4PZIPsvn2h1sArYOhgXQ=" crossorigin="anonymous"></script>

        <script type='text/javascript'>
            function addDimensionsToSrc(){
            jQuery("img").each(function(idx,el){
                el.src = el.src + "?height=" + el.height + "&width=" + el.width;    
            });
            }
        </script>
    </head>
    <body>
        <p>adfa</p>
        <p><img src="http://localhost:27756//download.jpg" alt="" width="282" height="179" /></p>
        <p>adfa</p>
        <p><img src="http://localhost:27756/Summit 2013-5.jpg" alt="" width="358" height="358" /></p>
        <p>adfa</p>
    </body>
</html>

Answer 3

$("img").each(function(idx, e) {
    $(this).attr("src", $(this).attr('src') + '?width=' + $(this).attr('width') + '&height=' + $(this).attr('height'));
});

在这里摆弄：https://jsfiddle.net/y794tazy/

要使用真实图像的宽度和高度（因为这可能与属性设置的不同），您可以这样做：

$("img").each(function(idx, e) {
    $(this).attr("src", $(this).attr('src') + '?width=' + $(this).width() + '&height=' + $(this).height());
});

将高度和宽度添加到多个img标记的Src

3 个答案: