关于计算样式

内置DOM没有提供getComputedStyle方法,但是提供了一个ComputedStyle属性用于获得元素的计算样式。

示例

'''Async
Dim
wv As WebViewer = e.Form.Controls("WebViewer1").WebViewer
Dim
box = wv.querySelector("#testBox")
Dim
output As String = "" 

output = output & "=== ComputedStyle 取值 ===" & vbCrLf
output = output &
"(读取计算后的最终样式)" & vbCrLf & vbCrLf 

' 读取各种计算样式(来自CSS样式表、内联样式、浏览器默认)
Dim
width = Await box.ComputedStyle.width
Dim
height = Await box.ComputedStyle.height
Dim
bgColor = Await box.ComputedStyle.backgroundColor
Dim
color = Await box.ComputedStyle.color
Dim
fontSize = Await box.ComputedStyle.fontSize
Dim
fontFamily = Await box.ComputedStyle.fontFamily
Dim
border = Await box.ComputedStyle.border
Dim
borderRadius = Await box.ComputedStyle.borderRadius
Dim
display = Await box.ComputedStyle.display
Dim
margin = Await box.ComputedStyle.margin
Dim
padding = Await box.ComputedStyle.padding 

' 去除双引号
width = width.Trim(
""""c)
height = height.Trim(
""""c)
bgColor = bgColor.Trim(
""""c)
color = color.Trim(
""""c)
fontSize = fontSize.Trim(
""""c)
fontFamily = fontFamily.Trim(
""""c)
border = border.Trim(
""""c)
borderRadius = borderRadius.Trim(
""""c)
display = display.Trim(
""""c)
margin = margin.Trim(
""""c)
padding = padding.Trim(
""""c

output = output & "宽度: " & width & vbCrLf
output = output &
"高度: " & height & vbCrLf
output = output &
"背景色: " & bgColor & vbCrLf
output = output &
"文字颜色: " & color & vbCrLf
output = output &
"字体大小: " & fontSize & vbCrLf
output = output &
"字体: " & fontFamily & vbCrLf
output = output &
"边框: " & border & vbCrLf
output = output &
"圆角: " & borderRadius & vbCrLf
output = output &
"显示方式: " & display & vbCrLf
output = output &
"外边距: " & margin & vbCrLf
output = output &
"内边距: " & padding & vbCrLf 

MessageBoxA.Show(output, "ComputedStyle 取值")

连续访问计算样式的话,其实定义一个变量更方便:

Dim cmp = box.ComputedStyle ' 注意这里不需要Await
Dim
width = Await cmp.width
Dim
height = Await cmp.height
......


本页地址:http://www.foxtable.com/webhelp/topics/6380.htm