前面要加载一个jquery库。
[removed]
var setNewsImg = function(obj){
$(obj).find('img').each(function(i){
var imgw = $(this).width();
var imgh = $(this).height();
var scale=1;
if(imgw>634){
scale = 634/imgw;
console.log(scale);
$(this).height(scale*imgh);
$(this).width(scale*imgw);
}
});
在网页设计中，有时我们需要对文章中的图片进行统一的尺寸调整，以保持页面的美观和一致性。本篇文章将介绍一种基于jQuery的批量设置文章中所有图片width大小的方法，确保图片不超过预设的最大宽度，同时保持比例不变。
我们需要引入jQuery库，这是实现此功能的基础。在HTML文件中，可以通过在`<head>`标签内添加以下代码来引入jQuery库：
```html
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
```
然后，我们可以定义一个名为`setNewsImg`的函数，该函数接受一个参数`obj`，通常为包含图片元素的容器选择器。以下是该函数的代码：
```javascript
var setNewsImg = function(obj) {
$(obj).find('img').each(function(i) {
var imgw = $(this).width();
var imgh = $(this).height();
var scale = 1;
if (imgw > 634) {
scale = 634 / imgw;
console.log(scale);
$(this).height(scale * imgh);
$(this).width(scale * imgw);
}
});
}
```
在这个函数中，我们遍历`obj`下的所有`img`元素。获取每个图片的原始宽度`imgw`和高度`imgh`。如果图片宽度超过634像素，我们将计算缩放比例`scale`，使得图片宽度不超过634像素，然后根据比例调整图片的高度，以保持原图的比例。
在实际应用中，你可以根据需要调整634这个值，使其适应你的页面布局。为了调用这个函数，可以在文档加载完成后执行，如下所示：
```javascript
$(function() {
setNewsImg('.news-img');
})
```
这里，`.news-img`是包含图片的容器类名。当然，你也可以替换为你自己的选择器，比如`#articleContent`，只要它能准确地选中需要处理的图片元素。
另外，我们还可以看到其他几种不同的实现方式：
1. 代码二通过绑定`load`事件，针对ID为`imglist`的元素内的所有`img`标签进行尺寸调整，设定最大宽度为120像素，并保持图片比例。
2. 代码三与代码二类似，但针对类名为`.daima`的元素内的`img`标签，设定最大宽度为700像素。
3. 代码四则更进阶一些，它不仅限制图片宽度至600像素，还创建了一个链接包裹图片，用于点击图片后在新窗口中查看大图。同时，它使用了Lightbox插件（需额外引入）来实现图片的弹窗预览效果。
这些代码示例都展示了如何利用jQuery动态调整图片尺寸，以适应不同屏幕和页面布局的需求。在实际开发中，可以根据项目的具体需求，选择适合的代码段或进行适当的修改。
