I am now working on a JavaScript rich text editor, and I have encountered some problems. The execCommand that comes with js cannot meet the following two requirements:
1. Add a split line (that is, the hr tag) after the line, so I choose to modify directly that DOM (target is the currently selected row, and the label for each unformatted line is p)
var Hr = "<br><hr id="hr-" + new Date().getVarDate()+ ""/><br>"
var HrDOM = parseDom(Hr)
var target = this.editor.selection._currentRange.startContainer
var domType = target.__proto__.constructor.name
if(domType != "HTMLParagraphElement"){
if(domType == "HTMLLIElement"){
if(target.parentElement.parentElement.nextSibling)
target.parentElement.parentElement.parentElement.insertBefore(HrDOM, target.parentElement.nextSibling)
else
target.parentElement.parentElement.parentElement.appendChild(HrDOM)
}
else if(domType == "HTMLImageElement"){
if(target.nextSibling)
target.parentElement.insertBefore(HrDOM, target.nextSibling)
else
target.parentElement.appendChild(HrDOM)
}
else{
if(target.parentElement.nextSibling)
target.parentElement.parentElement.insertBefore(HrDOM, target.parentElement.nextSibling)
else
target.parentElement.parentElement.appendChild(HrDOM)
}
}
else{
target.innerHTML = Hr
}
2. To clear the format, the execCommand ("removeFormat") included with js can only clear the font size (such as H1 removeFormat" H2) or bold color attributes, but not the lists such as ul, ol, li, etc., so I"ll just operate on DOM
directly with a real expression.the disadvantage of these two ways is that it doesn"t work when I need ctrl-z to undo these two operations. I don"t know if there is any way to achieve the functions I mentioned above without the problem of irrevocable.