HtmlElement没有正确解析标记 [英] HtmlElement doesn't parse the tag properly
问题描述
我的html源代码中有以下行：
I have the following line in my html source:
<input class="phone" name="site_url" type="text" placeholder="Enter Your Website URL">
当我使用WebBrowser Control（C＃）导航并将我的网站加载到HtmlDocument对象，然后循环在每个HtmlElement上，当我到达上面的input元素时：
When I navigate using WebBrowser Control (C#) and load my site to an HtmlDocument object, and then loop over each HtmlElement, when I get to the input element above:
我无法获得占位符属性。 GetAttribute（placeholder）返回。
我检查了OuterHtml / InnerHtml字段并注意到占位符属性是用复制而其他属性不是，而且，我可以检索其他属性（名称，类）。
I can't get the placeholder attribute. GetAttribute("placeholder") returns "". I checked the OuterHtml/InnerHtml fields and noted that placeholder attribute is copied with "" while other attributes are not, moreover, I can retrieve other attributes (name, class).
这是InnerHtml / OuterHtml的输出：
This is the output of InnerHtml/OuterHtml:
<INPUT class=phone placeholder="Enter Your Website URL" name=site_url>
任何人都可以解释为什么这样做以及如何在这种情况下更改占位符？
Can anybody explain why is that and how can I change placeholder in this case?
推荐答案
默认情况下， WebBrowser 控件在IE7兼容模式下运行。在该模式下，不支持占位符属性。因此，首先您需要将其切换到IE10模式，这里是如何 。然后，您需要调用非托管的 getAttributeNode 并获得值，具体如下：
By default, WebBrowser control runs in IE7 compatibility mode. In that mode, placeholder attribute is not supported. Thus, first you need to switch it into IE10 mode, here's how. Then, you would need to call unmanaged getAttributeNode and get its value, here's how:
bool FindElementWithPlaceholder(HtmlElement root, string placeholder, ref HtmlElement found, ref string value)
{
foreach (var child in root.Children)
{
var childElement = (HtmlElement)child;
dynamic domElement = childElement.DomElement;
dynamic attrNode = domElement.getAttributeNode(placeholder);
if (attrNode != null)
{
string v = attrNode.value;
if (!String.IsNullOrWhiteSpace(v))
{
value = v;
found = childElement;
return true;
}
}
if (FindElementWithPlaceholder(childElement, placeholder, ref found, ref value))
return true;
}
return false;
}
// ...
HtmlElement element = null;
string value = null;
if (FindElementWithPlaceholder(this.WB.Document.Body, "placeholder", ref element, ref value))
MessageBox.Show(value);
此代码已经过IE10测试。
This code has been tested with IE10.
您仍然可以使用上面的代码检索占位符的值，即使 WebBrowser功能控件未实现。但是，在这种情况下，占位符将无法直观地运行，因为该文档不会处于HTML5模式。
You can still retrieve the value of placeholder with the above code, even if WebBrowser Feature Control is not emplemented. However, placeholder won't function visually in such case, because the document won't be in HTML5 mode.
也许，我终于明白了你的想法。尝试此代码，看看它是否这样做。您仍需要功能控件和DOCTYPE才能启用HTML5。
Perhaps, I finally understand what you want. Try this code and see if it does that. You still need the Feature Control and DOCTYPE to enable HTML5.
HTML: <!doctype html><html><input class=phone placeholder=\"Enter Your Website URL\" name=site_url></html>
HtmlElement element = null;
string oldValue = null;
string newValue = "New Value";
FindElementWithPlaceholder(this.webBrowser1.Document.Body, "placeholder", ref element, ref value, newValue);
bool FindElementWithPlaceholder(HtmlElement root, string placeholder, ref HtmlElement found, ref string oldValue, string newValue)
{
foreach (var child in root.Children)
{
var childElement = (HtmlElement)child;
dynamic domElement = childElement.DomElement;
dynamic attrNode = domElement.getAttributeNode(placeholder);
if (attrNode != null)
{
string v = attrNode.value;
if (!String.IsNullOrWhiteSpace(v))
{
domElement.removeAttributeNode(attrNode);
domElement.setAttribute(placeholder, newValue);
// a hack to make IE10 to render the new placeholder
var id = domElement.getAttribute("id");
var uniqueId = Guid.NewGuid().ToString();
domElement.setAttribute("id", uniqueId);
var html = domElement.outerHTML;
domElement.outerHTML = html;
var newElement = root.Document.GetElementById(uniqueId);
domElement = newElement.DomElement;
if (String.IsNullOrEmpty(id))
domElement.removeAttribute("id");
else
domElement.setAttribute("id", id);
found = newElement;
oldValue = v;
return true;
}
}
if (FindElementWithPlaceholder(childElement, placeholder, ref found, ref oldValue, newValue))
return true;
}
return false;
}
这篇关于HtmlElement没有正确解析标记的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
