vue-editify 0.1.40 → 0.1.42

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "vue-editify",
-	"version": "0.1.40",
+	"version": "0.1.42",
 	"private": false,
 	"sideEffects": [
 		"*.css"

package/src/components/button/button.less

@@ -7,7 +7,7 @@
 	font-size: @font-size;
 
 	.editify-button-wrap {
-		padding: 0 4px;
+		padding: 2px 4px;
 		position: relative;
 
 		&.editify-right-border::after {

package/src/components/icon/icon.less

@@ -1,6 +1,6 @@
 @font-face {
 	font-family: 'editify-icon';
-	src: url('../../icon/iconfont.woff?t=1699274556400') format('woff'), url('../../icon/iconfont.ttf?t=1699274556400') format('truetype');
+	src: url('../../icon/iconfont.woff?t=2024051301') format('woff'), url('../../icon/iconfont.ttf?t=2024051301') format('truetype');
 }
 
 .editify-icon {

package/src/components/menu/menu.vue

@@ -14,7 +14,7 @@ import InsertVideo from '../insertVideo/insertVideo.vue'
 import InsertTable from '../insertTable/insertTable.vue'
 import { h, getCurrentInstance, ref, computed, inject, ComponentInternalInstance, Ref, ComputedRef, defineComponent } from 'vue'
 import { common as DapCommon } from 'dap-util'
-import { getRangeText, setHeading, setIndentIncrease, setIndentDecrease, setQuote, setAlign, setList, setTask, setTextStyle, setTextMark, removeTextStyle, removeTextMark, setLineHeight, insertLink, insertImage, insertVideo, insertTable, insertCodeBlock, hasPreInRange, hasTableInRange, hasQuoteInRange, hasLinkInRange, isRangeInQuote, isRangeInList, isRangeInTask, queryTextStyle, queryTextMark, getCurrentParsedomElement, hasImageInRange, hasVideoInRange, insertSeparator } from '../../core/function'
+import { getRangeText, setHeading, setIndentIncrease, setIndentDecrease, setQuote, setAlign, setList, setTask, setTextStyle, setTextMark, removeTextStyle, removeTextMark, setLineHeight, insertLink, insertImage, insertVideo, insertTable, insertCodeBlock, hasPreInRange, hasTableInRange, hasQuoteInRange, hasLinkInRange, isRangeInQuote, isRangeInList, isRangeInTask, queryTextStyle, queryTextMark, getMatchElementsByRange, hasImageInRange, hasVideoInRange, insertSeparator } from '../../core/function'
 import { MenuProps } from './props'
 import { MenuModeType, ObjectType, PluginResultType, MenuExtendType, MenuSequenceType, mergeObject } from '../../core/tool'
 import { AlexEditor, AlexElementsRangeType } from 'alex-editor'
@@ -923,7 +923,7 @@ const handleRangeUpdate = () => {
 	tableConfig.value.disabled = value_hasPreInRange || value_hasTableInRange || value_hasQuoteInRange || extraDisabled('table')
 
 	//代码块按钮激活
-	codeBlockConfig.value.active = !!getCurrentParsedomElement(editor.value, dataRangeCaches.value, 'pre')
+	codeBlockConfig.value.active = getMatchElementsByRange(editor.value, dataRangeCaches.value, { parsedom: 'pre' }).length == 1
 	//代码块按钮禁用
 	codeBlockConfig.value.disabled = value_hasTableInRange || value_hasQuoteInRange || value_hasImageInRange || value_hasVideoInRange || extraDisabled('codeBlock')
 

package/src/components/toolbar/toolbar.vue

@@ -100,7 +100,7 @@
 					<Icon value="delete-column"></Icon>
 				</Button>
 				<!-- 删除表格 -->
-				<Button @operate="deleteElement('table')" name="deleteTable" :title="$editTrans('deleteTable')" :tooltip="config.tooltip" :color="color">
+				<Button @operate="deleteElement('table')" leftBorder name="deleteTable" :title="$editTrans('deleteTable')" :tooltip="config.tooltip" :color="color">
 					<Icon value="delete-table"></Icon>
 				</Button>
 			</template>
@@ -201,7 +201,7 @@ import Checkbox from '../checkbox/checkbox.vue'
 import Colors from '../colors/colors.vue'
 import { AlexEditor, AlexElement, AlexElementsRangeType } from 'alex-editor'
 import { common as DapCommon } from 'dap-util'
-import { getCurrentParsedomElement, removeTextStyle, removeTextMark, setTextStyle, setLineHeight, setTextMark, setList, setTask, setHeading, setAlign, isRangeInList, isRangeInTask, queryTextStyle, queryTextMark } from '../../core/function'
+import { getMatchElementsByRange, removeTextStyle, removeTextMark, setTextStyle, setLineHeight, setTextMark, setList, setTask, setHeading, setAlign, isRangeInList, isRangeInTask, queryTextStyle, queryTextMark } from '../../core/function'
 import { ToolbarProps } from './props'
 import { Ref, computed, inject, ref } from 'vue'
 import { ObjectType } from '../../core/tool'
@@ -229,6 +229,7 @@ const linkConfig = ref<ObjectType>({
 	//链接是否新窗口打开
 	newOpen: false
 })
+
 //视频参数配置
 const videoConfig = ref<ObjectType>({
 	//是否显示控制器
@@ -240,6 +241,7 @@ const videoConfig = ref<ObjectType>({
 	//是否静音
 	muted: false
 })
+
 //代码块选择语言按钮配置
 const languageConfig = ref<ObjectType>({
 	show: props.config.codeBlock!.languages!.show,
@@ -254,6 +256,8 @@ const languageConfig = ref<ObjectType>({
 	active: false,
 	disabled: false
 })
+
+/** 以下是文本工具条的配置参数信息 */
 //标题按钮配置
 const headingConfig = ref<ObjectType>({
 	show: props.config.text!.heading!.show,
@@ -674,36 +678,36 @@ const modifyLink = () => {
 	if (!linkConfig.value.url) {
 		return
 	}
-	const link = getCurrentParsedomElement(editor.value, dataRangeCaches.value, 'a')
-	if (link) {
-		link.marks!.href = linkConfig.value.url
+	const links = getMatchElementsByRange(editor.value, dataRangeCaches.value, { parsedom: 'a' })
+	if (links.length == 1) {
+		links[0].marks!.href = linkConfig.value.url
 		if (linkConfig.value.newOpen) {
-			link.marks!.target = '_blank'
+			links[0].marks!.target = '_blank'
 		} else {
-			delete link.marks!.target
+			delete links[0].marks!.target
 		}
+		editor.value.formatElementStack()
+		editor.value.domRender()
 	}
-	editor.value.formatElementStack()
-	editor.value.domRender()
 }
 //移除链接
 const removeLink = () => {
-	const link = getCurrentParsedomElement(editor.value, dataRangeCaches.value, 'a')
-	if (link) {
-		link.parsedom = AlexElement.TEXT_NODE
-		delete link.marks!['target']
-		delete link.marks!['href']
-		delete link.marks!['data-editify-element']
+	const links = getMatchElementsByRange(editor.value, dataRangeCaches.value, { parsedom: 'a' })
+	if (links.length == 1) {
+		links[0].parsedom = AlexElement.TEXT_NODE
+		delete links[0].marks!['target']
+		delete links[0].marks!['href']
+		delete links[0].marks!['data-editify-element']
+		editor.value.formatElementStack()
+		editor.value.domRender()
+		editor.value.rangeRender()
 	}
-	editor.value.formatElementStack()
-	editor.value.domRender()
-	editor.value.rangeRender()
 }
 //选择代码语言
 const selectLanguage = (_name: string, value: string) => {
-	const pre = getCurrentParsedomElement(editor.value, dataRangeCaches.value, 'pre')
-	if (pre) {
-		Object.assign(pre.marks!, {
+	const pres = getMatchElementsByRange(editor.value, dataRangeCaches.value, { parsedom: 'pre' })
+	if (pres.length == 1) {
+		Object.assign(pres[0].marks!, {
 			'data-editify-hljs': value
 		})
 		editor.value.formatElementStack()
@@ -717,15 +721,15 @@ const insertParagraphWithPre = (type: string | undefined = 'up') => {
 		editor.value.range!.anchor.element = editor.value.range!.focus.element
 		editor.value.range!.anchor.offset = editor.value.range!.focus.offset
 	}
-	const pre = getCurrentParsedomElement(editor.value, dataRangeCaches.value, 'pre')
-	if (pre) {
+	const pres = getMatchElementsByRange(editor.value, dataRangeCaches.value, { parsedom: 'pre' })
+	if (pres.length == 1) {
 		const paragraph = new AlexElement('block', AlexElement.BLOCK_NODE, null, null, null)
 		const breakEl = new AlexElement('closed', 'br', null, null, null)
 		editor.value.addElementTo(breakEl, paragraph)
 		if (type == 'up') {
-			editor.value.addElementBefore(paragraph, pre)
+			editor.value.addElementBefore(paragraph, pres[0])
 		} else {
-			editor.value.addElementAfter(paragraph, pre)
+			editor.value.addElementAfter(paragraph, pres[0])
 		}
 		editor.value.range!.anchor.moveToEnd(paragraph)
 		editor.value.range!.focus.moveToEnd(paragraph)
@@ -740,17 +744,17 @@ const insertTableColumn = (type: string | undefined = 'left') => {
 		editor.value.range!.anchor.element = editor.value.range!.focus.element
 		editor.value.range!.anchor.offset = editor.value.range!.focus.offset
 	}
-	const table = getCurrentParsedomElement(editor.value, dataRangeCaches.value, 'table')
-	const column = getCurrentParsedomElement(editor.value, dataRangeCaches.value, 'td')
-	const tbody = getCurrentParsedomElement(editor.value, dataRangeCaches.value, 'tbody')
-	if (column && table && tbody) {
-		const rows = tbody.children
-		const index = column.parent!.children!.findIndex(item => {
-			return item.isEqual(column)
+	const tables = getMatchElementsByRange(editor.value, dataRangeCaches.value, { parsedom: 'table' })
+	const columns = getMatchElementsByRange(editor.value, dataRangeCaches.value, { parsedom: 'td' })
+	const tbodys = getMatchElementsByRange(editor.value, dataRangeCaches.value, { parsedom: 'tbody' })
+	if (tables.length == 1 && tbodys.length == 1 && columns.length == 1) {
+		const rows = tbodys[0].children
+		const index = columns[0].parent!.children!.findIndex(item => {
+			return item.isEqual(columns[0])
 		})
 		//插入列
 		rows!.forEach(row => {
-			const newColumn = column.clone(false)
+			const newColumn = columns[0].clone(false)
 			const breakEl = new AlexElement('closed', 'br', null, null, null)
 			editor.value.addElementTo(breakEl, newColumn)
 			if (type == 'left') {
@@ -760,7 +764,7 @@ const insertTableColumn = (type: string | undefined = 'left') => {
 			}
 		})
 		//插入col
-		const colgroup = table.children!.find(item => {
+		const colgroup = tables[0].children!.find(item => {
 			return item.parsedom == 'colgroup'
 		})!
 		const col = new AlexElement('closed', 'col', null, null, null)
@@ -772,11 +776,11 @@ const insertTableColumn = (type: string | undefined = 'left') => {
 		//渲染
 		editor.value.formatElementStack()
 		if (type == 'left') {
-			const previousColumn = editor.value.getPreviousElement(column)!
+			const previousColumn = editor.value.getPreviousElement(columns[0])!
 			editor.value.range!.anchor.moveToStart(previousColumn)
 			editor.value.range!.focus.moveToStart(previousColumn)
 		} else {
-			const nextColumn = editor.value.getNextElement(column)!
+			const nextColumn = editor.value.getNextElement(columns[0])!
 			editor.value.range!.anchor.moveToStart(nextColumn)
 			editor.value.range!.focus.moveToStart(nextColumn)
 		}
@@ -790,19 +794,19 @@ const insertTableRow = (type: string | undefined = 'up') => {
 		editor.value.range!.anchor.element = editor.value.range!.focus.element
 		editor.value.range!.anchor.offset = editor.value.range!.focus.offset
 	}
-	const table = getCurrentParsedomElement(editor.value, dataRangeCaches.value, 'table')
-	const row = getCurrentParsedomElement(editor.value, dataRangeCaches.value, 'tr')
-	if (table && row) {
-		const newRow = row.clone()
+	const tables = getMatchElementsByRange(editor.value, dataRangeCaches.value, { parsedom: 'table' })
+	const rows = getMatchElementsByRange(editor.value, dataRangeCaches.value, { parsedom: 'tr' })
+	if (tables.length == 1 && rows.length == 1) {
+		const newRow = rows[0].clone()
 		newRow.children!.forEach(column => {
 			column.children = []
 			const breakEl = new AlexElement('closed', 'br', null, null, null)
 			editor.value.addElementTo(breakEl, column)
 		})
 		if (type == 'up') {
-			editor.value.addElementBefore(newRow, row)
+			editor.value.addElementBefore(newRow, rows[0])
 		} else {
-			editor.value.addElementAfter(newRow, row)
+			editor.value.addElementAfter(newRow, rows[0])
 		}
 		editor.value.formatElementStack()
 		editor.value.range!.anchor.moveToStart(newRow)
@@ -817,15 +821,15 @@ const insertTableRow = (type: string | undefined = 'up') => {
 }
 //表格前后插入段落
 const insertParagraphWithTable = (type: string | undefined = 'up') => {
-	const table = getCurrentParsedomElement(editor.value, dataRangeCaches.value, 'table')
-	if (table) {
+	const tables = getMatchElementsByRange(editor.value, dataRangeCaches.value, { parsedom: 'table' })
+	if (tables.length == 1) {
 		const paragraph = new AlexElement('block', AlexElement.BLOCK_NODE, null, null, null)
 		const breakEl = new AlexElement('closed', 'br', null, null, null)
 		editor.value.addElementTo(breakEl, paragraph)
 		if (type == 'up') {
-			editor.value.addElementBefore(paragraph, table)
+			editor.value.addElementBefore(paragraph, tables[0])
 		} else {
-			editor.value.addElementAfter(paragraph, table)
+			editor.value.addElementAfter(paragraph, tables[0])
 		}
 		editor.value.range!.anchor.moveToEnd(paragraph)
 		editor.value.range!.focus.moveToEnd(paragraph)
@@ -836,9 +840,9 @@ const insertParagraphWithTable = (type: string | undefined = 'up') => {
 }
 //删除元素
 const deleteElement = (parsedom: string) => {
-	const element = getCurrentParsedomElement(editor.value, dataRangeCaches.value, parsedom)
-	if (element) {
-		element.toEmpty()
+	const elements = getMatchElementsByRange(editor.value, dataRangeCaches.value, { parsedom })
+	if (elements.length == 1) {
+		elements[0].toEmpty()
 		editor.value.formatElementStack()
 		editor.value.domRender()
 		editor.value.rangeRender()
@@ -850,17 +854,17 @@ const deleteTableRow = () => {
 		editor.value.range!.anchor.element = editor.value.range!.focus.element
 		editor.value.range!.anchor.offset = editor.value.range!.focus.offset
 	}
-	const table = getCurrentParsedomElement(editor.value, dataRangeCaches.value, 'table')
-	const row = getCurrentParsedomElement(editor.value, dataRangeCaches.value, 'tr')
-	if (table && row) {
-		const parent = row.parent!
+	const tables = getMatchElementsByRange(editor.value, dataRangeCaches.value, { parsedom: 'table' })
+	const rows = getMatchElementsByRange(editor.value, dataRangeCaches.value, { parsedom: 'tr' })
+	if (tables.length == 1 && rows.length == 1) {
+		const parent = rows[0].parent!
 		if (parent.children!.length == 1) {
 			deleteElement('table')
 			return
 		}
-		const previousRow = editor.value.getPreviousElement(row)!
-		const nextRow = editor.value.getNextElement(row)!
-		row.toEmpty()
+		const previousRow = editor.value.getPreviousElement(rows[0])!
+		const nextRow = editor.value.getNextElement(rows[0])!
+		rows[0].toEmpty()
 		editor.value.formatElementStack()
 		if (previousRow) {
 			editor.value.range!.anchor.moveToEnd(previousRow.children![0])
@@ -883,27 +887,27 @@ const deleteTableColumn = () => {
 		editor.value.range!.anchor.element = editor.value.range!.focus.element
 		editor.value.range!.anchor.offset = editor.value.range!.focus.offset
 	}
-	const column = getCurrentParsedomElement(editor.value, dataRangeCaches.value, 'td')
-	const tbody = getCurrentParsedomElement(editor.value, dataRangeCaches.value, 'tbody')
-	const table = getCurrentParsedomElement(editor.value, dataRangeCaches.value, 'table')
-	if (column && table && tbody) {
-		const rows = tbody.children!
-		const parent = column.parent!
+	const columns = getMatchElementsByRange(editor.value, dataRangeCaches.value, { parsedom: 'td' })
+	const tbodys = getMatchElementsByRange(editor.value, dataRangeCaches.value, { parsedom: 'tbody' })
+	const tables = getMatchElementsByRange(editor.value, dataRangeCaches.value, { parsedom: 'table' })
+	if (tables.length == 1 && tbodys.length == 1 && columns.length == 1) {
+		const rows = tbodys[0].children!
+		const parent = columns[0].parent!
 		if (parent.children!.length == 1) {
 			deleteElement('table')
 			return
 		}
-		const previousColumn = editor.value.getPreviousElement(column)!
-		const nextColumn = editor.value.getNextElement(column)!
-		const index = column.parent!.children!.findIndex(item => {
-			return item.isEqual(column)
+		const previousColumn = editor.value.getPreviousElement(columns[0])!
+		const nextColumn = editor.value.getNextElement(columns[0])!
+		const index = columns[0].parent!.children!.findIndex(item => {
+			return item.isEqual(columns[0])
 		})
 		//删除列
 		rows.forEach(row => {
 			row.children![index].toEmpty()
 		})
 		//删除col
-		const colgroup = table.children!.find(item => {
+		const colgroup = tables[0].children!.find(item => {
 			return item.parsedom == 'colgroup'
 		})!
 		colgroup.children![index].toEmpty()
@@ -922,29 +926,31 @@ const deleteTableColumn = () => {
 }
 //浮层显示时
 const layerShow = () => {
-	//代码块初始化展示设置
-	if (props.type == 'codeBlock') {
-		const pre = getCurrentParsedomElement(editor.value, dataRangeCaches.value, 'pre')
-		if (pre) {
-			languageConfig.value.displayConfig.value = pre.marks!['data-editify-hljs'] || ''
-		}
-	}
 	//链接初始化展示
-	else if (props.type == 'link') {
-		const link = getCurrentParsedomElement(editor.value, dataRangeCaches.value, 'a')
-		if (link) {
-			linkConfig.value.url = link.marks!['href']
-			linkConfig.value.newOpen = link.marks!['target'] == '_blank'
+	if (props.type == 'link') {
+		const links = getMatchElementsByRange(editor.value, dataRangeCaches.value, { parsedom: 'a' })
+		if (links.length == 1) {
+			linkConfig.value.url = links[0].marks!['href']
+			linkConfig.value.newOpen = links[0].marks!['target'] == '_blank'
 		}
 	}
 	//视频初始化显示
 	else if (props.type == 'video') {
-		const video = getCurrentParsedomElement(editor.value, dataRangeCaches.value, 'video')
-		if (video) {
-			videoConfig.value.autoplay = !!video.marks!['autoplay']
-			videoConfig.value.loop = !!video.marks!['loop']
-			videoConfig.value.controls = !!video.marks!['controls']
-			videoConfig.value.muted = !!video.marks!['muted']
+		const videos = getMatchElementsByRange(editor.value, dataRangeCaches.value, { parsedom: 'video' })
+		if (videos.length == 1) {
+			videoConfig.value.autoplay = !!videos[0].marks!['autoplay']
+			videoConfig.value.loop = !!videos[0].marks!['loop']
+			videoConfig.value.controls = !!videos[0].marks!['controls']
+			videoConfig.value.muted = !!videos[0].marks!['muted']
+		}
+	}
+	//代码块初始化展示设置
+	else if (props.type == 'codeBlock') {
+		const pres = getMatchElementsByRange(editor.value, dataRangeCaches.value, {
+			parsedom: 'pre'
+		})
+		if (pres.length == 1) {
+			languageConfig.value.displayConfig.value = pres[0].marks!['data-editify-hljs'] || ''
 		}
 	}
 	//文本工具条初始化显示

package/src/core/function.ts

@@ -6,63 +6,90 @@ import { common as DapCommon } from 'dap-util'
 import { cloneData, queryHasValue, getButtonOptionsConfig, ObjectType } from './tool'
 import { ButtonOptionsItemType } from '../components/button/props'
 
+export type ElementMatchConfig = {
+	parsedom?: string
+	marks?: ObjectType
+	styles?: ObjectType
+}
+
 /**
- * 判断元素是否在某个标签下，如果是返回该标签对应的元素，否则返回null
+ * 判断元素是否符合指定的条件
  * @param element
- * @param parsedom
+ * @param config
+ * @returns
+ */
+export const elementIsMatch = (element: AlexElement, config: ElementMatchConfig) => {
+	//默认是符合的
+	let isMatch = true
+	//如果存在parsedom判断并且parsedom不一样
+	if (config.parsedom && element.parsedom && config.parsedom != element.parsedom) {
+		isMatch = false
+	}
+	//如果存在marks判断
+	if (config.marks) {
+		const hasMarks = Object.keys(config.marks).every(key => {
+			return element.hasMarks() && element.marks![key] && element.marks![key] == config.marks![key]
+		})
+		//如果不是所有的mark都有
+		if (!hasMarks) {
+			isMatch = false
+		}
+	}
+	//如果存在styles判断
+	if (config.styles) {
+		const hasStyles = Object.keys(config.styles).every(key => {
+			return element.hasStyles() && element.styles![key] && element.styles![key] == config.styles![key]
+		})
+		//如果不是所有的styles都有
+		if (!hasStyles) {
+			isMatch = false
+		}
+	}
+	return isMatch
+}
+
+/**
+ * 判断元素是否在符合条件的元素下，如果是返回符合条件的元素，否则返回null
+ * @param element
+ * @param config
  * @returns
  */
-export const getParsedomElementByElement = (element: AlexElement, parsedom: string): AlexElement | null => {
+export const getMatchElementByElement = (element: AlexElement, config: ElementMatchConfig): AlexElement | null => {
 	if (element.isBlock()) {
-		return element.parsedom == parsedom ? element : null
+		return elementIsMatch(element, config) ? element : null
 	}
-	if (!element.isText() && element.parsedom == parsedom) {
+	if (elementIsMatch(element, config)) {
 		return element
 	}
-	return getParsedomElementByElement(element.parent!, parsedom)
+	return getMatchElementByElement(element.parent!, config)
 }
 
 /**
- * 获取光标是否在指定标签下，如果是返回该标签对应的元素，否则返回null
+ * 判断光标范围内的元素是否在符合条件的元素下，如果是所有的返回符合条件的元素，否则返回[]
  * @param editor
  * @param dataRangeCaches
- * @param parsedom
+ * @param config
  * @returns
  */
-export const getCurrentParsedomElement = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType, parsedom: string) => {
+export const getMatchElementsByRange = (editor: AlexEditor, dataRangeCaches: AlexElementsRangeType, config: ElementMatchConfig) => {
+	let elements: AlexElement[] = []
 	if (!editor.range) {
-		return null
+		return elements
 	}
 	if (editor.range.anchor.element.isEqual(editor.range.focus.element)) {
-		return getParsedomElementByElement(editor.range.anchor.element, parsedom)
-	}
-	const arr = dataRangeCaches.list.map(item => {
-		return getParsedomElementByElement(item.element, parsedom)
-	})
-	let hasNull = arr.some(el => {
-		return el == null
-	})
-	//如果存在null，则表示有的选区元素不在指定标签下，返回null
-	if (hasNull) {
-		return null
-	}
-	//如果只有一个元素，则返回该元素
-	if (arr.length == 1) {
-		return arr[0]!
-	}
-	//默认数组中的元素都相等
-	let flag = true
-	for (let i = 1; i < arr.length; i++) {
-		if (!arr[i]!.isEqual(arr[0]!)) {
-			flag = false
-			break
+		const element = getMatchElementByElement(editor.range.anchor.element, config)
+		if (element) {
+			elements = [element]
 		}
+		return elements
 	}
-	//如果相等，则返回该元素
-	if (flag) {
-		return arr[0]
-	}
-	return null
+	dataRangeCaches.flatList.forEach(item => {
+		const element = getMatchElementByElement(item.element, config)
+		if (element && !elements.some(el => el.isEqual(element))) {
+			elements.push(element)
+		}
+	})
+	return elements
 }
 
 /**
@@ -132,10 +159,10 @@ export const hasPreInRange = (editor: AlexEditor, dataRangeCaches: AlexElementsR
 		return false
 	}
 	if (editor.range.anchor.isEqual(editor.range.focus)) {
-		return !!getParsedomElementByElement(editor.range.anchor.element, 'pre')
+		return !!getMatchElementByElement(editor.range.anchor.element, { parsedom: 'pre' })
 	}
 	return dataRangeCaches.flatList.some(item => {
-		return !!getParsedomElementByElement(item.element, 'pre')
+		return !!getMatchElementByElement(item.element, { parsedom: 'pre' })
 	})
 }
 
@@ -150,10 +177,10 @@ export const isRangeInPre = (editor: AlexEditor, dataRangeCaches: AlexElementsRa
 		return false
 	}
 	if (editor.range.anchor.isEqual(editor.range.focus)) {
-		return !!getParsedomElementByElement(editor.range.anchor.element, 'pre')
+		return !!getMatchElementByElement(editor.range.anchor.element, { parsedom: 'pre' })
 	}
 	return dataRangeCaches.list.every(item => {
-		return !!getParsedomElementByElement(item.element, 'pre')
+		return !!getMatchElementByElement(item.element, { parsedom: 'pre' })
 	})
 }
 
@@ -168,10 +195,10 @@ export const hasQuoteInRange = (editor: AlexEditor, dataRangeCaches: AlexElement
 		return false
 	}
 	if (editor.range.anchor.isEqual(editor.range.focus)) {
-		return !!getParsedomElementByElement(editor.range.anchor.element, 'blockquote')
+		return !!getMatchElementByElement(editor.range.anchor.element, { parsedom: 'blockquote' })
 	}
 	return dataRangeCaches.flatList.some(item => {
-		return !!getParsedomElementByElement(item.element, 'blockquote')
+		return !!getMatchElementByElement(item.element, { parsedom: 'blockquote' })
 	})
 }
 
@@ -186,10 +213,10 @@ export const isRangeInQuote = (editor: AlexEditor, dataRangeCaches: AlexElements
 		return false
 	}
 	if (editor.range.anchor.isEqual(editor.range.focus)) {
-		return !!getParsedomElementByElement(editor.range.anchor.element, 'blockquote')
+		return !!getMatchElementByElement(editor.range.anchor.element, { parsedom: 'blockquote' })
 	}
 	return dataRangeCaches.list.every(item => {
-		return !!getParsedomElementByElement(item.element, 'blockquote')
+		return !!getMatchElementByElement(item.element, { parsedom: 'blockquote' })
 	})
 }
 
@@ -278,10 +305,10 @@ export const hasLinkInRange = (editor: AlexEditor, dataRangeCaches: AlexElements
 		return false
 	}
 	if (editor.range.anchor.isEqual(editor.range.focus)) {
-		return !!getParsedomElementByElement(editor.range.anchor.element, 'a')
+		return !!getMatchElementByElement(editor.range.anchor.element, { parsedom: 'a' })
 	}
 	return dataRangeCaches.flatList.some(item => {
-		return !!getParsedomElementByElement(item.element, 'a')
+		return !!getMatchElementByElement(item.element, { parsedom: 'a' })
 	})
 }
 
@@ -296,10 +323,10 @@ export const hasTableInRange = (editor: AlexEditor, dataRangeCaches: AlexElement
 		return false
 	}
 	if (editor.range.anchor.isEqual(editor.range.focus)) {
-		return !!getParsedomElementByElement(editor.range.anchor.element, 'table')
+		return !!getMatchElementByElement(editor.range.anchor.element, { parsedom: 'table' })
 	}
 	return dataRangeCaches.flatList.some(item => {
-		return !!getParsedomElementByElement(item.element, 'table')
+		return !!getMatchElementByElement(item.element, { parsedom: 'table' })
 	})
 }
 
@@ -314,10 +341,10 @@ export const hasImageInRange = (editor: AlexEditor, dataRangeCaches: AlexElement
 		return false
 	}
 	if (editor.range.anchor.isEqual(editor.range.focus)) {
-		return !!getParsedomElementByElement(editor.range.anchor.element, 'img')
+		return !!getMatchElementByElement(editor.range.anchor.element, { parsedom: 'img' })
 	}
 	return dataRangeCaches.flatList.some(item => {
-		return !!getParsedomElementByElement(item.element, 'img')
+		return !!getMatchElementByElement(item.element, { parsedom: 'img' })
 	})
 }
 
@@ -332,10 +359,10 @@ export const hasVideoInRange = (editor: AlexEditor, dataRangeCaches: AlexElement
 		return false
 	}
 	if (editor.range.anchor.isEqual(editor.range.focus)) {
-		return !!getParsedomElementByElement(editor.range.anchor.element, 'video')
+		return !!getMatchElementByElement(editor.range.anchor.element, { parsedom: 'video' })
 	}
 	return dataRangeCaches.flatList.some(item => {
-		return !!getParsedomElementByElement(item.element, 'video')
+		return !!getMatchElementByElement(item.element, { parsedom: 'video' })
 	})
 }
 
@@ -1298,10 +1325,10 @@ export const insertCodeBlock = (editor: AlexEditor, dataRangeCaches: AlexElement
 	if (!editor.range) {
 		return
 	}
-	const pre = getCurrentParsedomElement(editor, dataRangeCaches, 'pre')
-	if (pre) {
+	const pres = getMatchElementsByRange(editor, dataRangeCaches, { parsedom: 'pre' })
+	if (pres.length == 1) {
 		let content = ''
-		AlexElement.flatElements(pre.children!)
+		AlexElement.flatElements(pres[0].children!)
 			.filter(item => {
 				return item.isText()
 			})
@@ -1313,9 +1340,9 @@ export const insertCodeBlock = (editor: AlexEditor, dataRangeCaches: AlexElement
 			const paragraph = new AlexElement('block', AlexElement.BLOCK_NODE, null, null, null)
 			const text = new AlexElement('text', null, null, null, item)
 			editor.addElementTo(text, paragraph)
-			editor.addElementBefore(paragraph, pre)
+			editor.addElementBefore(paragraph, pres[0])
 		})
-		pre.toEmpty()
+		pres[0].toEmpty()
 	} else {
 		//起点和终点在一起
 		if (editor.range.anchor.isEqual(editor.range.focus)) {