Textänderungsspuren_VML bezogen

在办公自动化，公文审核的时候，就需要用到 留痕操作了，就是把修改的东西直接在文本上显示，而不直接改动它。在以前，我没有用VML去做，很勉强的用 TextRange 改变文本的颜色，然后增加一个层显示更改信息。第一次修改还可以实现，但不能做到再次修改，因为，第二次修改的时候，那些原来创建的对象都消失了，而这些对象都是通过 Select 操作得到的，用户不选择，脚本就没有办法创建那些对象。
    不久前，我想到了 VML ，开始还觉得是不可能的事情，但我发现了 TextRange 对象一个很强大的方法 getClientRects(),这个方法可以返回 TextRange 对象包含的每一行的矩形信息。意思是说，如果你用鼠表选择一段文本，文本会自动高亮显示，这样看上去就是一块块矩形组成的不规则图形。getClientRects 方法就可以得到这些矩形的坐标和高宽，这样一来，就可以在选择的文本外套一层 VML 画的矩形，Oh my god...真是酷呆了。当我第一次看到它的时候，兴奋的抱着小白(猫)满屋子乱跳。     接下来，讲讲 TextRange 对象以及 getClientRects 和 VML 结合画痕迹：
    TextRange 对象，顾名思义，文本区域，就是网页上的一部分区域，可以是文本也可以是图像和别的段落格式。所有能用鼠标选择的都可以变成 TextRange 对象。IE4 的时候就出现了。TextRange 有个强大的方法就是 execCommand()，它可以执行很多命令，动态更改网页中内容、样式。创建 TextRange 对象一般有两种途径，一种是用户选择了一段文本，可以使用 var oTextRange=document.selection.createRange(); 还有种就是直接把document 创建成 TextRange :var oTextRange=document.createTextRane() 。不知道有没有注意，两个方式使用的函数不一样，第一个因为本省就是文字了，所有使用 createRange(), 第二个不能确定是否都是文字，所有，必须用 createTextRange()。
    使用 getClientRects 返回的是一个 TextRectangle 对象，它是一个集合，没个子集拥有四个属性 bottom,top,left,right ，就是两个角的坐标，这个坐标值是相对于页面的，所以可以直接应用到 VML 中来。

function createRect(num)
{
 var newMark=document.createElement("

");
 edit.insertBefore(newMark);
 var oRcts = oTempRange.getClientRects();//oTempRange是一个 TextRange 对象
 for(var i=0;i<oRcts.length;i++)
{
var t=oRcts[i].top;
var l=oRcts[i].left;
var r=oRcts[i].right;
var b=oRcts[i].bottom;
var newRect=document.createElement("");
  newMark.insertBefore(newRect);
  newRect.style.posTop=t+document.body.scrollTop-3;
  newRect.style.posLeft=l-2;
  newRect.style.width=r-l;
  newRect.style.height=b-t;
  newRect.style.visibility="";
 }
}

Ich werde nicht mehr über andere Codes sprechen, sondern über den gesamten Skriptausführungsprozess. Zuerst wählt der Benutzer mit der Maus einen Text aus, dann erstellt das Skript sofort ein temporäres TextRange-Objekt aus dem ausgewählten Text und ändert die Hintergrundfarbe des Texts zum Vergleich über execCommand. Wenn der Benutzer mit der rechten Maustaste klickt, überprüft das Skript die Ereignisquelle des Benutzers. Wenn das temporäre TextRange-Objekt vorhanden ist, wird im Menü das Element „Markieren“ angezeigt. Wenn die Ereignisquelle bereits markierter Text ist, wird im Menü „Abbrechen“ angezeigt. Markieren Sie diesen Artikel. Wenn der Benutzer „Ausgewählt markieren“ auswählt, öffnet das Skript ein Dialogfeld, in dem der Benutzer aufgefordert wird, die Verarbeitung des ausgewählten Textes einzugeben.
Wenn das Skript die Auswahl des Benutzers erhält, führt es den obigen Code aus, verwendet VML, um den ausgewählten Text einzurahmen, und generiert dann eine Ebene, auf der der geänderte Inhalt aufgezeichnet wird. Wenn der Benutzer „Markierung aufheben“ auswählt, wird der Ausdruck „popID=XX“ beim Rechtsklick-Ereignis verwendet. Diese popID ist eine globale Variable, um das entsprechende VML-Tag und die entsprechende Ebene zu finden. und machen Sie dann ihr äußeres HTML leer, was dazu dient, die Markierung aufzuheben!
Sie können die Seite unten besuchen, um den Prozess zu verstehen.
Textänderungsspuren


Bisher wurde die gesamte Einführung in VML geschrieben. Natürlich denke ich, dass es hier immer noch Fehler gibt, es gibt auch viele Verständnisdefizite und es gibt immer noch Defizite im Ausdruck. Da VML noch nicht weit verbreitet, aber leistungsstark ist, ist es meines Erachtens notwendig, dass jeder die VML-Technologie versteht, zumindest damit jeder weiß, dass viele Dinge tatsächlich mit VML erledigt werden können. Lasst uns gemeinsam lernen!