javascript - js代码在应用程序的其他区域使用/加载之前动态设置图像的宽度和高度

Question

我在网页上显示下面的 div 内容，其中包含表格、图像和更多 html 元素(我正在从我在网页上显示的数据库中获取 div 内容)。

<div class="appDiv">
 <div>  <h1><font color="red"> Title here</font></h1> </div>
<table><tr><th>Header1</th><th>Header2</th></tr><tr><td>one</td><td>two</td></tr></table>
    <img src="data:image/png;base64,/9j/4AAQSkZJRgABAQEBLAEsAAD/2w..............Z0auj5MNqRUIfYT7C/cEhSmGlRdn6/wDrACwSw+eV/u/bvuN0D/TZZTeE8Sdtooj7/wB5Q6C/DTrP/9k=" data-filename='image.png' style='width: 1081.05px; height: 512.635px;'>
</div>

我想在我的应用程序的其他区域使用上述内容，但问题是由于位置限制，我需要减小图像的宽度和高度。我想更改图像的宽度和高度动态图像 在我在应用程序的其他部分使用上述代码之前。

js代码: 当用户将上面的 div 内容导出到其他部分时调用下面的代码，这里我需要更改 div 中显示的任何图像的宽度和高度

 function($scope) {

   $scope.loadWebContentInOtherArea= function() {


   }
 }

<img>上面显示的标签在加载到网页的其他部分之前没有类名或 id 来设置宽度和高度。当图像没有任何类名时，如何动态设置图像的宽度和高度或分配给它的 ID。 请参阅<img>标签，它定义了style='width: 1081.05px; height: 512.635px;'

Answer 1

How can i set dynamically the width and height of the image when it doesn't have any class name or ID assigned to it.

既然你是...

displaying the below div content

并且您的 div 有一个类，您可以调用每个 div 元素并找到每个 img 元素并设置尺寸。

var imgEl = document.querySelector('.appDiv img');
imgEl.width = 100;
imgEl.height = 100;