Html()
An advanced parsing and selection model to work with HTML blocks in a very JQuery like selector manner
Usage
OBJECT = Html(
htmlbody
)
Argument | Summary |
---|---|
htmlbody | the HTML body or snippet |
Calling
Supports named-parameter calling allowing you to use the function like:
Html( htmlbody=? );
Supports passing parameters as a structure using ArgumentCollection:
Html( ArgumentCollection={ htmlbody : ? } );
Extra
The html() fucntion is a wrapper to the very powerful Java JSoup parsing library that gives a very flexible selector and manipulation API for managing HTML code.
<cfscript> http = Http( url='http://www.openbd.org/', result="requestHTML"); doc = html( requestHTML.filecontent ); allLinks = doc.select("a[href]"); for ( x = 1; x <= ArrayLen(allLinks); x++ ){ WriteOutput("<li>" & allLinks[x].attr("href") & " / " & allLinks[x].text() & "</li>" ); } </cfscript>
Each selector returns a rich object that has methods you can use to either further select, introspect or modify the HTML block. You can see this by performing a CFDUMP on the object.
Selectors will either return a single Element object, or an array of Elements.
Selector syntax (reproduced)
A selector is a chain of simple selectors, seperated by combinators. Selectors are case insensitive (including against elements, attributes, and attribute values).
The universal selector (*) is implicit when no element selector is supplied (i.e. *.header
and .header
is equivalent).
Pattern | Matches | Example |
---|---|---|
* |
any element | * |
tag |
elements with the given tag name | div |
ns|E |
elements of type E in the namespace ns | fb|name finds <fb:name> elements |
#id |
elements with attribute ID of "id" | div#wrap , #logo |
.class |
elements with a class name of "class" | div.left , .result |
[attr] |
elements with an attribute named "attr" (with any value) | a[href] , [title] |
[^attrPrefix] |
elements with an attribute name starting with "attrPrefix". Use to find elements with HTML5 datasets | [^data-] , div[^data-] |
[attr=val] |
elements with an attribute named "attr", and value equal to "val" | img[width=500] , a[rel=nofollow] |
[attr^=valPrefix] |
elements with an attribute named "attr", and value starting with "valPrefix" | a[href^=http:] |
[attr$=valSuffix] |
elements with an attribute named "attr", and value ending with "valSuffix" | img[src$=.png] |
[attr*=valContaining] |
elements with an attribute named "attr", and value containing "valContaining" | a[href*=/search/] |
[attr~=regex] |
elements with an attribute named "attr", and value matching the regular expression | img[src~=(?i)\\.(png|jpe?g)] |
The above may be combined in any order | div.header[title] |
|
Combinators |
||
E F |
an F element descended from an E element | div a , .logo h1 |
E > F |
an F direct child of E | ol > li |
E + F |
an F element immediately preceded by sibling E | li + li , div.head + div |
E ~ F |
an F element preceded by sibling E | h1 ~ p |
E, F, G |
all matching elements E, F, or G | a[href], div, h3 |
Pseudo selectors |
||
:lt(n) |
elements whose sibling index is less than n | td:lt(3) finds the first 2 cells of each row |
:gt(n) |
elements whose sibling index is greater than n | td:gt(1) finds cells after skipping the first two |
:eq(n) |
elements whose sibling index is equal to n | td:eq(0) finds the first cell of each row |
:has(selector) |
elements that contains at least one element matching the selector | div:has(p) finds divs that contain p elements |
:not(selector) |
elements that do not match the selector. | |
:contains(text) |
elements that contains the specified text. The search is case insensitive. The text may appear in the found element, or any of its descendants. | p:contains(jsoup) finds p elements containing the text "jsoup". |
:matches(regex) |
elements whose text matches the specified regular expression. The text may appear in the found element, or any of its descendants. | td:matches(\\d+) finds table cells containing digits. div:matches((?i)login) finds divs containing the text, case insensitively. |
:containsOwn(text) |
elements that directly contains the specified text. The search is case insensitive. The text must appear in the found element, not any of its descendants. | p:containsOwn(jsoup) finds p elements with own text "jsoup". |
:matchesOwn(regex) |
elements whose own text matches the specified regular expression. The text must appear in the found element, not any of its descendants. | td:matchesOwn(\\d+) finds table cells directly containing digits. div:matchesOwn((?i)login) finds divs containing the text, case insensitively. |
The above may be combined in any order and with other selectors | .light:contains(name):eq(0) |