html免费编辑器图片alt,html – 如何在Quill编辑器中添加图像属性?我想添加’alt’和’title’属性...

本文介绍如何在Quill文档中为上传图片时保留'src'属性,并为SEO增添替代文字和标题。提供两种方法,包括自定义ImageBlot类来管理图片属性和格式化。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

当我上传图片时,只保存其’src’.我想为SEO目的添加替代文字和标题.我尝试在Quill文档中搜索模块,但找不到任何模块. 最佳答案 也许不是直接的答案,而是相关的.

以下是从全文html初始化时保留图像属性的解决方案.

解决方法1:

class ImageBlot extends Image {

static create(value) {

if (typeof value == 'string') {

return super.create(value);

} else {

return value;

}

}

static value(domNode) {

return domNode;

}

}

Quill.register(ImageBlot);

溶液2:

class ImageBlot extends Image {

static get ATTRIBUTES() {

return [ 'alt', 'height', 'width', 'class', 'data-original', 'data-width', 'data-height', 'style-data' ]

}

static formats(domNode) {

return this.ATTRIBUTES.reduce(function(formats, attribute) {

if (domNode.hasAttribute(attribute)) {

formats[attribute] = domNode.getAttribute(attribute);

}

return formats;

}, {});

}

format(name, value) {

if (this.constructor.ATTRIBUTES.indexOf(name) > -1) {

if (value) {

this.domNode.setAttribute(name, value);

} else {

this.domNode.removeAttribute(name);

}

} else {

super.format(name, value);

}

}

}

Quill.register(ImageBlot);

您可以使用solution2为属性指定白名单.

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值