关于修改css样式网页依旧无变化
 
这几天遇到了idea中使用jsp引用以前的css样式正常变化的情况
一开始修改边框的颜色正常，后续再修改之后发现不论是重启idea或者重启chrome都不会进行相应的变化，于是我开始意识到不是代码的问题，开始认为是idea问题或者chrome的问题。
  
 

 
这几天遇到了idea中使用jsp引用以前的css样式正常变化的情况
 
一开始修改边框的颜色正常，后续再修改之后发现不论是重启idea或者重启chrome都不会进行相应的变化，于是我开始意识到不是代码的问题，开始认为是idea问题或者chrome的问题。
 
终于通过搜索知道，是浏览器中的css数据缓存默认打开了，于是更改后的css无法更新显示
 解决的方法
 
键盘点击 F12（或者 浏览器页面右击-检查）-network-勾选Disable cache
 
 总结，对自己还是要适当自信hhh

 这段时间给公司做了个网站，在本地用IE10，火狐，goolgeChrome,360浏览器通过页面样式测试。
 
 本地通过测试后便上传到服务器，上传之后用IE10浏览发现有部份样式异常。火狐，goolgeChrome,360浏览与本地浏览样式效果一样。
 
     和平时一样，有问题找度娘。大部分网友说：编码问题，也有说样式没有加载更有说是缓存问题···，我用文本编辑器notepad++查看CSS文件发现ANSI格式，难道真是编码格式问题？立马改成UTF-8保存并上传至服务器。
 
     测试结果让并没有发生改变，看来不是编码问题。本地测试正常远程服务器上却异常，难不成是服务器环境的问题？自己马上搭建IIS，本地服务器环境很好就OK了，接着测试浏览结果都很正常。开始怀疑空间商的服务器环境了，因为我用的windows平台，空间商的是linux平台。难不我再搭建个linux平台再测试？
 
     静下心来想了想，其它浏览器都没问题就IE有问题，是不是应该在IE上找找问题呢？打开IE再次浏览远程服务器的网页，按下F12键打开发人员工具，忽然间我发现浏览器模式：IE10，文档模式：IE7。
 
     这里显然有问题，把文档模式改成标准。IE10页面马上发生变化与之前本地测试完全一样。至此问题原因以经找到。本地与远程服务器不一致的样式是因为IE10文档编码发生了变化。找到问题原因，便进入问题解决方案。
 
     解决方法在网页加入<meta http-equiv="X-UA-Compatible" content="IE=edge" >代码。X-UA-Compatible是针对 IE8 以上版本的一个特殊文件头标记，用于为 IE8 以上版本指定不同的页面渲
 
 染模式，对于ie8之下的版本浏览器是不识别的。
 
 
 在X-UA-Compatible中可用的方法有：
 
 <meta http-equiv="X-UA-Compatible" content="IE=5" >
 
 <meta http-equiv="X-UA-Compatible" content="IE=7" >
 
 <meta http-equiv="X-UA-Compatible" content="IE=8" >
 
 <meta http-equiv="X-UA-Compatible" content="IE=edge" >
 
 其中最后一行是Edge 模式，通知 Windows Internet Explorer 以最高级别的可用模式显示内容。
 
 虽然这个问题已经解决，但最终暴露出另外两个问题 。
 
 1、为什么我在本地搭建的IIS服务器，IE浏览文档模式是正常标准。而上传却变成了IE7？
 
 2、说明CSS文件兼容性不是很完美在IE7或以下会发生异常。
 

 
 
本文出自 “谌大集团” 博客，请务必保留此出处http://52czy.blog.51cto.com/3704825/1548628
 

解决IE浏览器打印iframe页面时字体等样式缩小的问题
 
目录
 
1.问题描述
 
2.解决方案
 
3.代码
 
 
 
1.问题描述
 
  问题主要集中于打印 iframe， 前端调用浏览器打印功能，在谷歌，火狐浏览器上预览打印内容，和真实打印内容都是页面的正常样式。但是在IE浏览器中调用打印，以及打印出来的内容样式就会发生改变，字体样式缩小，页面被缩放等。在百度诸多的文章后，找到了解决办法。
 
2.解决方案
 
  谷歌和火狐浏览器可直接调用 window.print(); 
 
 但是在IE浏览器调用 window.print(); 页面就会被缩放，所以当客户是使用IE浏览器时，调用 document.execCommand('print', false, null); 方法；
 
3.代码
 
    /* 判断是否是IE浏览器*/
    function isIE(){
        if (!!window.ActiveXObject || "ActiveXObject" in window)
            return true;
        else
            return false;
    }

    /* 在打印的方法中调用*/
    function print(){
        if(isIE()){
                document.body.className += ' ext-ie';
                document.execCommand('print', false, null);
            }else{
                window.print();
            }
        }
    }
 
如有帮助，请帮忙点个赞咯。

一 使用c#的WebBroswer控件
 
1   在被调用方法类上加上[ComVisible(true)]标签，意思就是当前类可以com组件的形式供外包调用
 
   [ComVisible(true)]
    public partial class WebBrowserForm{
}
 
2 使用pubilc公开方法提供js调用
 
  public void xmpf(string name)
        {

            messageBox.Show(name);

        }
 
3 在类的构造函数里加载页面代码
 
（1）调用对象类是本身类
 
  public WebBrowserForm()
        {
            InitializeComponent();      
            string pathName = Application.StartupPath + "\\" + "test.html";
            this.webBrowser2.ObjectForScripting = this;
            webBrowser2.Navigate(pathName);
        }
 
（2）调用对象类是其他类
 
[System.Runtime.InteropServices.ComVisibleAttribute(true)]  
class myClass  
{  
   public void xmpf()  
   {  
        System.Windows.Forms.MessageBox.Show("alert:Test");  
   }  
}  

  public WebBrowserForm()
        { 
            this.webBrowser2.ObjectForScripting = new myClass(); 
        }
 
(3)使用将具体属性加入 Reflection 物件。直接把扩展js属性加入
 
     private void jsExtension(mshtml.HTMLDocument doc)
        {
            IExpando windowEx = (IExpando)doc.parentWindow;
            PropertyInfo MyExtension = windowEx.GetProperty("myExtension", BindingFlags.Default);
            if (MyExtension == null)
            {
                MyExtension = windowEx.AddProperty("myExtension");
                MyExtension.SetValue(windowEx, this, null);
            }
        }
 
4 使用js调用
 
  window.external.xmpf(obj.name,obj.value, obj.checked);
 
或者
 
window.top.myExtension.Submit();
 
总结： 1 使用[ComVisible(true)]标记类对com组件可见
 
           2  使用WebBrowser的ObjectForScripting类引用此类
 
在c#WebBroswer调用网页本身js
 
webBrowser1.Document.InvokeScript("jsAlert ", new string[] {‘ssss’}); 
 
在c#WebBroswer调用添加本身js 
 
IHTMLWindow2 win = (IHTMLWindow2)webBrowser.Document.Window.DomWindow;
win.execScript(strScript, "Javascript")
 
2 在 WebKit（Cefsharp）使用
 
1暴露的.NET类为Javascript
 
public class BoundObject  
{  
    public void MyMethod()  {   }  
}  
//browser表示你的CefSharp对象使用它的RegisterJsObject来绑定你的.net类  
browser.RegisterJsObject("bound", new BoundObject());  
//在实际的JS代码中，你将使用这样的对象：
bound.myMethod(); // 使用此调用方法。
 
 
1.基本的同(异)步js操作
 
browser.GetBrowser().MainFrame.ExecuteJavaScriptAsync("document.getElementById('testid').click();");  
browser.GetBrowser().MainFrame.ExecuteJavaScriptAsync("document.getElementById('testid2').value='123'");  
 
2.其他Frame操作
 
string script = "if(document.getElementById('img_out_10000')){ document.getElementById('img_out_10000').click(); }";  
var list = browser.GetBrowser().GetFrameNames();  
if (list.Count > 1)  
{  
    browser.GetBrowser().GetFrame(list[1]).ExecuteJavaScriptAsync(script);  
}  
 
3.如何调用Javascript方法返回的结果呢？
 如果您需要评估代码，返回一个值，使用Task EvaluateScriptAsync(string script, TimeSpan? timeout)方法。 JavaScript代码是异步执行的，因此使用.NET Task类返回一个响应，其中包含错误消息，结果和一个成功（布尔）标志。
 
// Get Document Height  
var task = frame.EvaluateScriptAsync("(function() { var body = document.body, html = document.documentElement;
 return  Math.max( body.scrollHeight, body.offsetHeight,
 html.clientHeight, html.scrollHeight, html.offsetHeight ); })();", null);
task.ContinueWith(t =>  
{  
    if (!t.IsFaulted)  
    {  
        var response = t.Result;  
        EvaluateJavaScriptResult = response.Success ? (response.Result ?? "null") : response.Message;  
    }  
}, TaskScheduler.FromCurrentSynchronizationContext());  
 
总结：
 
1 保留.net类为js，把需要暴露的对象传入ChromiumWebBrowser类的RegisterJsObject方法即可。
 
2  使用异步，把字符串传入GetBrowser().MainFrame.ExecuteJavaScriptAsync()方法;
 
3 frame操作，GetFrameNames获取所有frame,获取单个GetFrame，ExecuteJavaScriptAsync（）执行异步
 
4 获取结果 ，先用task接收EvaluateScriptAsync（str,null）返回结果，然后执行ContinueWith方法获取结果，传入t参数，Result就是返回值
 
可以在页面加载完之后执行所需方法绑定js
 
LoadingStateChanged页面加载完执行方法
 
 webBrowser.LoadingStateChanged += WebBrowser_LoadingStateChanged; 
    private void WebBrowser_LoadingStateChanged(object sender, CefSharp.LoadingStateChangedEventArgs e){
e.Browser.MainFrame.EvaluateScriptAsync(@"");
} 
 
 
1 把谷歌内核浏览器插件添加到当前控件集
 
            webBrowser = new ChromiumWebBrowser(url);
            webBrowser.Dock = DockStyle.Fill;//填充方式
            this.Controls.Add(webBrowser);
 
ie控件浏览器与网页交互（csExWB）
 
 
 
doucument操作
 
5 没有id,name，可以直接通过标签获取元素
 
  var bxtxtable = document.getElementById('query').getElementsByTagName('table')[1];
        var trs = bxtxtable.rows;
            var l = trs.length;
            if (l < 1) {
                return;
            }
            for (var i = 0; i < l; i++) {
                var tr = trs[i];
                var td = tr.cells[0] 
        
                }  
        } 
 
扩展：
 
SynchronizationContextTaskScheduler
 
这是一个同步上下文的taskscheduler，原理就是把繁重的耗时工作丢给ThreadPool，然后将更新UI的操作丢给 UI线程的队列中，由UIThread来执行
 
 
 
TWebBrowser 与 MSHTML(5): document 对象的属性、方法、事件纵览
 
{IHTMLDocument2 方法:}
write                 //写入
writeln               //写入并换行
open                  //打开一个流，以收集 document.write 或 document.writeln 的输出
close                 //关闭并输出用 document.open 方法打开的流
clear                 //清空文档中所有元素, 可能暂时不支持
queryCommandSupported //是否支持指定命令
queryCommandEnabled   //指定命令是否有效
queryCommandState     //是否设置了指定命令
queryCommandIndeterm  //指定命令是否处于不确定状态
queryCommandText      //命令
queryCommandValue     //命令值
execCommand           //执行命令
execCommandShowHelp   //命令帮助信息
createElement         //建立元素
elementFromPoint      //指定坐标下的元素
createStyleSheet      //创建一个样式表
 
{IHTMLDocument2 属性:}
all                   //所有 HTML 元素的集合
images                //所有 image 对象的集合
applets               //所有 applet 对象的集合
links                 //所有 link 对象的集合
forms                 //所有 form 对象的集合
anchors               //所有 anchor 对象的集合
scripts               //所有 script 对象的集合
frames                //所有 frame 对象的集合, 这应该和 window.frames 是一样的
embeds                //所有 embed 对象的集合
plugins               //所有 plugin 对象的集合
styleSheets           //样式表集合
title                 //网页标题
body                  //body 对象
activeElement         //当前具有输入焦点的元素
designMode            //设计模式, 可选值: Inherit On Off
selection             //当前选择
readyState            //页面读取状态: uninitialized、loading、loaded、interactive、completed
linkColor             //链接的颜色
alinkColor            //活动链接的颜色
vlinkColor            //已访问过的链接的颜色
bgColor               //背景颜色
fgColor               //文本颜色
referrer              //返回载入当前页面的页面的 URL
location              //同 window.location
lastModified          //返回文档最后修改的日期和时间
url                   //返回当前文档的 URL
domain                //返回域名
cookie                //返回文档相关的 cookie
expando               //可设置与获取的布尔值, 是否允许扩展
charset               //获取文档的字符集名称
defaultCharset        //获取浏览器默认的字符集名称
mimeType              //文档类型
fileSize              //文档大小, 单位字节, 用字符串表示
fileCreatedDate       //文档建立时间 ???
fileModifiedDate      //文档修改时间 ???
fileUpdatedDate       //文档更新时间 ???
security              //文档安全
protocol              //传输协议
nameProp              //文件标题, 好像同 Title
parentWindow          //父窗口
Script                //
 
{IHTMLDocument2 事件:}
onhelp                //用 F1 获取帮助时
onclick               //单击时
ondblclick            //双击时
onmousedown           //鼠标点下时
onmouseup             //鼠标抬起时
onmousemove           //鼠标移动时
onmouseover           //鼠标进入时
onmouseout            //鼠标离开时
onkeypress            //按键时
onkeyup               //键按住时
onkeydown             //键抬起时
onreadystatechange    //状态改变时
onrowexit             //当前数据源的数据将要发生变化时
onrowenter            //当前数据源的数据发生变化并且有新的数据时
ondragstart           //开始拖动时
onselectstart         //开始选择时
onbeforeupdate        //更新前
onafterupdate         //更新后
onerrorupdate         //更新错误时
 
 
{IHTMLDocument3 方法:}
recalc                //重新获取文档中的全部动态属性
releaseCapture        //释放文档中对象的鼠标捕捉
 
{IHTMLDocument3 属性:}
createTextNode        //建立文本
attachEvent           //绑定事件
detachEvent           //取消事件绑定
createDocumentFragment//创建新文档
getElementsByName     //返回带有指定 name 的对象集合
getElementById        //返回指定 id 的第一个对象的引用
getElementsByTagName  //返回指定标签的对象集合
documentElement       //获取文档根部节点, 也就是 HTML 节点
uniqueID              //获取对象的唯一标识符
dir                   //
parentDocument        //
enableDownload
baseUrl               //基础地址
 
{IHTMLDocument3 事件:}
onrowsdelete          //当前数据记录被删除时
onrowsinserted        //当前数据源将要插入新数据时
oncellchange          //当数据来源发生变化时
ondatasetchanged      //数据源发生变化时
ondataavailable       //当数据接收完成时
ondatasetcomplete     //当数据源的全部有效数据读取完毕时
onpropertychange      //改变属性时
oncontextmenu         //当按下鼠标右键出现菜单或通过键盘触发页面菜单时
onstop                //停止或离开时
 
 
{IHTMLDocument4 方法:}
focus                 //获得输入焦点
hasFocus              //是否拥有输入焦点
createDocumentFromUrl //下载指定网页并返回其 IHTMLDocument2 接口
CreateEventObject     //生成当使用 fireEvent 方法时用于传递事件相关信息的 event 对象 ???
FireEvent
 
{IHTMLDocument4 属性:}
createRenderStyle     //建立 IHTMLRenderStyle 接口
namespaces            //
media                 //
URLUnencoded          //获取去除字符编码的 URL
 
{IHTMLDocument4 事件:}
onselectionchange     //改变选择时
oncontrolselect       //好像是框选时
 
 
{IHTMLDocument5 方法:}
createAttribute       //建立指定 name 的属性
createComment         //建立注释
 
{IHTMLDocument5 属性:}
doctype               //文档类型
implementation_       //获取 IHTMLDOMImplementation 接口
compatMode            //兼容模式, 返回 BackCompat、CSS1Compat 等
 
{IHTMLDocument5 事件:}
onmousewheel          //旋转鼠标滚动轮时
onfocusin             //获取输入焦点时
onfocusout            //失去输入焦点时
onactivate            //激活时
ondeactivate          //当前对象变为父文档的其他对象时
onbeforeactivate      //onactivate 前
onbeforedeactivate    //ondeactivate 前
 
参考文献：
 
https://blog.csdn.net/u010085423/article/details/72765971 
 
https://www.cnblogs.com/huangxincheng/p/6781581.html
 
https://blog.csdn.net/wwm402654282/article/details/46344709