当前位置:首页 > 技术分享 > 正文内容

php js正则 解决 详情页图片超出问题 匹配img标签内容追加style样式,给富文本中的图片设置大小和居中显示

admin2周前 (03-15)技术分享61

做小程序或手机端经常会遇到商品详情,文章详情里带图片的从别的地方复制过来带着样式,导致超出屏幕显示不全的问题


php解决

function format_img($content,$style=''){
    if(empty($style))$style = 'max-width:100%;height:auto;';
    $content= preg_replace("/(\<img)(?!(.*?style=['\"](.*)['\"])[^\>]+\>)/i", "$1 style=\"\"$2" , $content); 
    return preg_replace("/(\<img.*?style=['\"])([^\>]+\>)/i", "$1".$style."$2" , $content); 
}

Js解决

function format_img(htmlstr){
	//正则匹配不含style="" 或 style='' 的img标签
	var regex1 = new RegExp("(i?)(\<img)(?!(.*?style=['\"](.*)['\"])[^\>]+\>)","gmi");
	//给不含style="" 或 style='' 的img标签加上style=""
	htmlstr = htmlstr.replace(regex1, "$2 style=\"\"$3");
        //正则匹配含有style的img标签
	var regex2 = new RegExp("(i?)(\<img.*?style=['\"])([^\>]+\>)","gmi");
	htmlstr = htmlstr.replace(regex2, "$2max-width:100%;height:auto;border:5px solid red;$3");
	return htmlstr;
}


还有一种比较变态的做法是直接用正则表达式删除img标签的width、height、style

<?php
$txt1='<a href="https://blog.bitefu.net/post/501.html" style="margin:0 auto;border-radius:6px; background-color: #ffb808;display: block;text-align: center;padding: 12px 12px 12px 12px;color:#fff; width: 180px;font-weight: bold;">查看历史中奖记录</a><img src="http://www.baidu.com/Uploads/ueditor/image/20170512/1494556977462196.jpg" title="1494556977462196.jpg" alt="timg.jpg" style="width: 524px; height: 689px;" width="524" height="689"><img src="http://www.baidu.com/Uploads/ueditor/image/20170512/1494556977462196.jpg" title="1494556977462196.jpg" alt="timg.jpg" style="width: 524px; height: 689px;" width="524" height="689">';
$txt1 = preg_replace( '/(<img.*?)(style=.+?[\'|"])|((width)=[\'"]+[0-9]+[\'"]+)|((height)=[\'"]+[0-9]+[\'"]+)/i', '$1' , $txt1); 
echo $txt1;
?>


扫描二维码推送至手机访问。

版权声明:本文由小刚刚技术博客发布,如需转载请注明出处。

本文链接:https://blog.bitefu.net/post/501.html

分享给朋友:
返回列表

上一篇:一键搭建科学上网工具proxysu

没有最新的文章了...

相关文章

解决 SVN Skipped 'xxx' -- Node remains in conflict

更新命令:svn up提示代码:意思就是说 ,这个文件冲突了,你要解决下Updating '.': Skipped 'data/config.php' -- ...

超高性比的斐讯盒子T1,刷第三方YYF固件机教程超级详细版

超高性比的斐讯盒子T1,刷第三方YYF固件机教程超级详细版

家里面买了斐讯盒子T1,必不可少的就是刷机,刷机一直爽,一直刷机一直爽,这样的快乐一般人体会不到。原来斐讯盒子N1,T1,还有斐讯K2P路由器也变成了性价比超高的东东,而且众多大神也带来了超多可玩性非常高的固件和破解。楼主今天扒到了相关超高...

2021可用的百度网盘高速下载方法分享

2021可用的百度网盘高速下载方法分享

最新可用方法https://blog.bitefu.net/post/163.html方法很简单就是利用网盘直链下载助手【网盘直链下载助手】是一款免费开源获取网盘文件真实下载地址的油猴脚本,基于PCSAPI,支持Windows,Mac,Li...

PHP AES加解密 (ECB模式/sha1prng算法/PKCS5Padding和PKCS7Padding补码) ECB 模式不需求设置 iv

php7+ 版本/**  * [AesSecurity aes加密,支持PHP7+]  * 算法模式:ECB  * 密钥长度:128  * 补...

PIP 更换国内安装源linux/windows

pip国内的一些镜像  阿里云 http://mirrors.aliyun.com/pypi/simple/   中国科技大学 https://pypi.mirrors.ustc.edu.cn/simple/   豆瓣(...

遭遇国外ip抓取或攻击怎么办一招解决禁止海外IP访问

遭遇国外ip抓取或攻击怎么办一招解决禁止海外IP访问

究发现很多网站被攻击都是来自海外的肉鸡,所以禁掉海外IP访问网站也是不错的防护手段,而且国内网站几乎很少有国外用户访问,称之为大局域网也不为过。今天主机吧来教大家如何利用域名解析禁止掉海外IP访问网站。绝大多数域名解析服务商都是提供电信联通...

发表评论

访客

◎欢迎参与讨论,请在这里发表您的看法和观点。