在线时间:8:00-16:00
迪恩网络APP
随时随地掌握行业动态
扫描二维码
关注迪恩网络微信公众号
上一个例子中我们学会了查找文本——究跟到底,对Web页面还是只读不写。那么,如果说要把所有的搜索结果高亮显示呢?我们很快会想到把所有匹配的文字颜色、背景改一下就可以了。 首先想到的可能是直接修改HTML文本吧……但是,与SourceCode的高亮显示不同,我们需要并且只需要高亮页面中的文本部分。HTML标签、脚本代码等等是绝对不应该去改动的。因此我们不能把整个页面的Source Code读进来然后replace,那样有破坏HTML文件结构的可能;我们只能在能够分离出文本与其他内容(标签,脚本……)的前提下进行。 方法一:使用TextRange(IHTMLTxtRange)
public partial class HilightDemo : Form
{ // 定义高亮显示效果的标签。 string tagBefore ="<span style='background-color:yellow;color:black'>"; string tagAfter ="</span>"; // …… privatevoid btnHilight_Click(object sender, EventArgs e) { HtmlDocument htmlDoc = webBrowser.Document; string keyword = txtKeyword.Text.Trim(); if (keyword == "") return; object oTextRange = htmlDoc.Body.InvokeMember("createTextRange"); mshtml.IHTMLTxtRange txtrange = oTextRange as mshtml.IHTMLTxtRange; while (txtrange.findText(keyword, 1, 4)) { try { txtrange.pasteHTML(tagBefore + keyword + tagAfter); } catch { } txtrange.collapse(false); } } }
public partial class HilightDemo : Form
{ //…… privatevoid btnHilight_Click(object sender, EventArgs e) { HTMLDocument document = (HTMLDocument)webBrowser.Document.DomDocument; IHTMLDOMNode bodyNode = (IHTMLDOMNode)webBrowser.Document.Body.DomElement; string keyword = txtKeyword.Text.Trim(); if (keyword =="") return; HilightText(document, bodyNode, keyword); } privatevoid HilightText(HTMLDocument document, IHTMLDOMNode node, string keyword) { // nodeType = 3:text节点 if (node.nodeType ==3) { string nodeText = node.nodeValue.ToString(); // 如果找到了关键字 if (nodeText.Contains(keyword)) { IHTMLDOMNode parentNode = node.parentNode; // 将关键字作为分隔符,将文本分离,并逐个添加到原text节点的父节点 string[] result = nodeText.Split(newstring[] { keyword }, StringSplitOptions.None); for (int i =0; i < result.Length -1; i++) { if (result[i] !="") { IHTMLDOMNode txtNode = document.createTextNode(result[i]); parentNode.insertBefore(txtNode, node); } IHTMLDOMNode orgNode = document.createTextNode(keyword); IHTMLDOMNode hilightedNode = (IHTMLDOMNode)document.createElement("SPAN"); IHTMLStyle style = ((IHTMLElement)hilightedNode).style; style.color ="black"; style.backgroundColor ="yellow"; hilightedNode.appendChild(orgNode); parentNode.insertBefore(hilightedNode, node); } if (result[result.Length -1] !="") { IHTMLDOMNode postNode = document.createTextNode(result[result.Length -1]); parentNode.insertBefore(postNode, node); } parentNode.removeChild(node); } // End of nodeText.Contains(keyword) } else { // 如果不是text节点,则递归搜索其子节点 IHTMLDOMChildrenCollection childNodes = node.childNodes as IHTMLDOMChildrenCollection; foreach (IHTMLDOMNode n in childNodes) { HilightText(document, n, keyword); } } } } 上面的两段代码都是为了清晰易懂而精简得不能再简的,有很多地方很不完善。比如,没考虑到如何从高亮显示状态复原;也没有大小写匹配等等。当然,掌握了原理之后相信这些都不会太难。
<b>Hel</b>lo World!
先不管作者出于什么目的让Hel三个字母成为粗体,总之显示在页面上的是一句“Hello World!”。在我们希望高亮页面中的“Hello”这个关键字时,如果用DOM分析的话,会得出含有“Hel”的<b>节点和文本节点“lo World!”两个节点,因此无法将其挑出来。而TextRange则能正确识别,将其设置为高亮。因此也可以说TextRange是只和文本有关,和HTML语法结构无关的对象。
function DoAdd(a, b) {
return a + b; } 那么,我们要在WinForm调用它,只需如下代码即可:
object oSum = webBrowser.Document.InvokeScript("DoAdd", newobject[] { 1, 2 });
int sum = Convert.ToInt32(oSum); 其次,如果我们想执行一段Web页面中原本没有的脚本,该怎么做呢?这次.Net的类没有提供,看来还要依靠COM了。IHTMLWindow2可以将任意的字符串作为脚本代码来执行。
string scriptline01 =@"function ShowPageInfo() {";
string scriptline02 =@" var numLinks = document.links.length; "; string scriptline03 =@" var numForms = document.forms.length; "; string scriptline04 =@" var numImages = document.images.length; "; string scriptline05 =@" var numScripts = document.scripts.length; "; string scriptline06 =@" alert('网页的统计结果:\r\n链接数:' + numLinks + "; string scriptline07 =@" '\r\n表单数:' + numForms + "; string scriptline08 =@" '\r\n图像数:' + numImages + "; string scriptline09 =@" '\r\n脚本数:' + numScripts);}"; string scriptline10 =@"ShowPageInfo();"; string strScript = scriptline01 + scriptline02 + scriptline03 + scriptline04 + scriptline05 + scriptline06 + scriptline07 + scriptline08 + scriptline09 + scriptline10; IHTMLWindow2 win = (IHTMLWindow2)webBrowser.Document.Window.DomWindow; win.execScript(strScript, "Javascript"); http://www.xmlasp.net/n1670c13.aspx |
请发表评论