Mshtml.HTMLDocument how to hide dynamically created div with class attribute

I am trying to load the load on a webpage in a C # WebBrowser control (WPF is not WinForm). Along with other content on the page there is an image rotator that dynamically creates two divs that have the same class to use a rotating image. In the LoadComplete event of the WebBrowser control, I attach a stylesheet to hide the two divs. The two divs created dynamically when the page loads are the following:

 <div class="backgroundImageDivsClass" style=" width: 100%; height: 100%; position: fixed; top: 0px; left: 0px; padding: 0px; margin: 0px; z-index: -9999; opacity: 1; background-image: url("data/767/Course/9214/1000000001_474030834.jpg"); background-position: left top; background-size: 100% 100%; background-repeat: no-repeat; "></div> <div class="backgroundImageDivsClass"></div> 

And the way css is assigned inside the LoadComplete event of the webbrowser control:

 mshtml.IHTMLStyleSheet styleSheet = Document.createStyleSheet(string.Empty, 0); styleSheet.cssText = @".backgroundImageDivsClass{display:none;}"; 

But this seems to be inoperable because it does not hide the div. Someone please give me an idea of ​​what I am missing.

+5
source share
3 answers

This is the method I used based on your descriptions and it works great.

  public MainForm() { InitializeComponent(); webBrowser.DocumentCompleted += webBrowser_DocumentCompleted; var text = @"<html> <body> <div class=""backgroundImageDivsClass""> <span> hello everyone!</span> </div> </body> </html>"; webBrowser.DocumentText = text; } void webBrowser_DocumentCompleted(object sender, WebBrowserDocumentCompletedEventArgs e) { var doc = webBrowser.Document.DomDocument as IHTMLDocument2; var styleSheet = doc.createStyleSheet(string.Empty, 0); var ruleIndex = styleSheet.addRule(".backgroundImageDivsClass", "display:none", 0);//index can be used to remove the rule //styleSheet.cssText = @".backgroundImageDivsClass{display:none;}"; } 
+3
source
 styleSheet.cssText = @".backgroundImageDivsClass{display:none !important;}"; 

This is my suggestion. This will force you to override anything that tries to set the display property. (Similar to image rotator control), because any important tags are applied by the latest DOM

Help if this does not work.

Use the firebug plugin in Firefox to determine which CSS attributes apply dynamically to your div.

You can edit the generated firebug CSS in real time until you find a solution that works, and then include it in your solution.

This article complements my suggestions well: http://www.smashingmagazine.com/2010/11/02/the-important-css-declaration-how-and-when-to-use-it/

+2
source

I believe the problem is that you are using the createStyleSheet method in the document, not in the Document.DomDocument. The answer here may be a helpful link.

Also, since you can read here createStyleSheet is no longer supported. Starting with Internet Explorer 11 you should use document.createElement ('style')

+1
source

Source: https://habr.com/ru/post/1210634/


All Articles