<
>

js获取富文本中的第一张图片(正则表达式)

2020-02-21 23:57:47 来源:易采站长站 作者:王振洲

var content= UE.getEditor(‘details').getContent();

上面是我编辑器里的内容(content),最简单的方法是用

$(content)来转换成jquery对象,但是$(content).html()的打印结果如下:

可以看出来转换出的Jquery对象代表的是content中第一个html元素p,剩下的html元素获取不到,也就无法进行第三步获取图片地址。
这里可以补充的是,网上提供的一种方法

$(content).get(0).outerHTML的打印结果如下:

get(1)、get(2)…依次可以打印出接下来的html元素代码,我开始考虑循环获取,但是循环次数的获取回到了原地,根本取不到,有兴趣的可以尝试。

既然jquery的思路断了,我就开始考虑原生js的方法,在网上找了个:

var $div = document.createElement("div");//创建一个div元素对象
$div.innerHTML = content;//往div里填充html

打印出来的结果非常好:

前面绕的弯两行代码就解决了,原生js真棒!
但是我还是习惯用jquery,又把它转换成jquery了,方便下面的选择器和循环

var $v = $($div);//从dom对象转换成jquery对象

3.选择器找到img元素,获取src值

$.each($v.find("img"),function (v,i) {
console.log("src======"+i.src);
});

i.src可以直接获取图片url地址,成功!

到此这篇关于js获取富文本中的第一张图片(正则表达式)的文章就介绍到这了,更多相关js获取网页编辑器中的图片内容请搜素易采站长站以前的文章或下面相关文章,希望大家以后多多支持易采站长站!

暂时禁止评论

微信扫一扫

易采站长站微信账号