Haste.DOM

DOM manipulation functions using String for string representation.

Documentation

data AttrName

The name of an attribute. May be either a common property, an HTML attribute or a style attribute.

Constructors

PropName !JSString

StyleName !JSString

AttrName !JSString

Instances

Eq AttrName

Ord AttrName

IsString AttrName

data Attribute

A key/value pair representing the value of an attribute. May represent a property, an HTML attribute, a style attribute or a list of child elements.

class IsElem a where

The class of types backed by DOM elements.

Minimal complete definition

elemOf

Methods

elemOf :: a -> Elem

Get the element representing the object.

fromElem :: Elem -> IO (Maybe a)

Attempt to create a DOM element backed object from an Elem. The default instance always returns Nothing.

Instances

IsElem Elem

IsElem Audio

IsElem Canvas

IsElem Bitmap

newtype Elem

A DOM node.

Constructors

Elem JSAny

Instances

FromAny Elem

ToAny Elem

IsElem Elem

BitmapSource Elem

attribute :: AttrName -> JSString -> Attribute

Construct an Attribute.

set :: (IsElem e, MonadIO m) => e -> [Attribute] -> m ()

Set a number of Attributes on an element.

with :: (IsElem e, MonadIO m) => m e -> [Attribute] -> m e

Set a number of Attributes on the element produced by an IO action. Gives more convenient syntax when creating elements:

newElem "div" `with` [
    style "border" =: "1px solid black",
    ...
  ]

children :: [Elem] -> Attribute

Attribute adding a list of child nodes to an element.

click :: (IsElem e, MonadIO m) => e -> m ()

Generate a click event on an element.

focus :: (IsElem e, MonadIO m) => e -> m ()

Generate a focus event on an element.

blur :: (IsElem e, MonadIO m) => e -> m ()

Generate a blur event on an element.

document :: Elem

The DOM node corresponding to document.

documentBody :: Elem

The DOM node corresponding to document.body.

appendChild :: (IsElem parent, IsElem child, MonadIO m) => parent -> child -> m ()

Append the second element as a child of the first.

addChild :: (IsElem parent, IsElem child, MonadIO m) => child -> parent -> m ()

Deprecated: Use appendChild instead. Note that appendChild == flip addChild.

Append the first element as a child of the second element.

addChildBefore :: (IsElem parent, IsElem child, MonadIO m) => child -> parent -> child -> m ()

Deprecated: Use insertChildBefore instead. Note insertChildBefore == parent new old -> addChildBefore new parent old.

Insert an element into a container, before another element. For instance: addChildBefore childToAdd theContainer olderChild

insertChildBefore :: (IsElem parent, IsElem before, IsElem child, MonadIO m) => parent -> before -> child -> m ()

Insert an element into a container, before another element. For instance: insertChildBefore theContainer olderChild childToAdd

getFirstChild :: (IsElem e, MonadIO m) => e -> m (Maybe Elem)

Get the first of an element's children.

getLastChild :: (IsElem e, MonadIO m) => e -> m (Maybe Elem)

Get the last of an element's children.

getChildren :: (IsElem e, MonadIO m) => e -> m [Elem]

Get a list of all children belonging to a certain element.

setChildren :: (IsElem parent, IsElem child, MonadIO m) => parent -> [child] -> m ()

Clear the given element's list of children, and append all given children to it.

clearChildren :: (IsElem e, MonadIO m) => e -> m ()

Remove all children from the given element.

deleteChild :: (IsElem parent, IsElem child, MonadIO m) => parent -> child -> m ()

Remove the second element from the first's children.

removeChild :: (IsElem parent, IsElem child, MonadIO m) => child -> parent -> m ()

Deprecated: Use deleteChild instead. Note that deleteChild = flip removeChild.

DEPRECATED: use deleteChild instead! Note that deleteChild = flip removeChild.

type PropID = String

type ElemID = String

type QuerySelector = String

type ElemClass = String

type AttrValue = String

prop :: String -> AttrName

Create a DOM property name. See http://stackoverflow.com/questions/6003819/properties-and-attributes-in-html for more information about the difference between attributes and properties.

style :: String -> AttrName

Create a style attribute name.

attr :: String -> AttrName

Create an HTML attribute name.

(=:) :: AttrName -> AttrValue -> Attribute

Create an Attribute.

newElem :: MonadIO m => String -> m Elem

Create an element.

newTextElem :: MonadIO m => String -> m Elem

Create a text node.

elemById :: MonadIO m => ElemID -> m (Maybe Elem)

Get an element by its HTML ID attribute.

elemsByQS :: MonadIO m => Elem -> QuerySelector -> m [Elem]

Get all children elements matching a query selector.

elemsByClass :: MonadIO m => ElemClass -> m [Elem]

Get all elements of the given class.

setProp :: (IsElem e, MonadIO m) => e -> PropID -> String -> m ()

Set a property of the given element.

getProp :: (IsElem e, MonadIO m) => e -> PropID -> m String

Get a property of an element.

setAttr :: (IsElem e, MonadIO m) => e -> PropID -> String -> m ()

Set an attribute of the given element.

getAttr :: (IsElem e, MonadIO m) => e -> PropID -> m String

Get an attribute of an element.

getValue :: (IsElem e, MonadIO m, JSType a) => e -> m (Maybe a)

Get the value property of an element; a handy shortcut.

withElem :: MonadIO m => ElemID -> (Elem -> m a) -> m a

Perform an IO action on an element.

withElems :: MonadIO m => [ElemID] -> ([Elem] -> m a) -> m a

Perform an IO action over several elements. Throws an error if some of the elements are not found.

withElemsQS :: (IsElem e, MonadIO m) => e -> QuerySelector -> ([Elem] -> m a) -> m a

Perform an IO action over the a list of elements matching a query selector.

mapQS :: (IsElem e, MonadIO m) => e -> QuerySelector -> (Elem -> m a) -> m [a]

Map an IO computation over the list of elements matching a query selector.

mapQS_ :: (IsElem e, MonadIO m) => e -> QuerySelector -> (Elem -> m a) -> m ()

Like mapQS but returns no value.

getStyle :: (IsElem e, MonadIO m) => e -> PropID -> m String

Get a CSS style property of an element.

setStyle :: (IsElem e, MonadIO m) => e -> PropID -> String -> m ()

Set a CSS style property on an element.

getFileData :: (IsElem e, MonadIO m) => e -> Int -> m (Maybe Blob)

Get a file from a file input element.

getFileName :: (IsElem e, MonadIO m) => e -> m String

Get the name of the currently selected file from a file input element. Any directory information is stripped, and only the actual file name is returned, as the directory information is useless (and faked) anyway.

setClass :: (IsElem e, MonadIO m) => e -> String -> Bool -> m ()

Add or remove a class from an element's class list.

toggleClass :: (IsElem e, MonadIO m) => e -> String -> m ()

Toggle the existence of a class within an elements class list.

hasClass :: (IsElem e, MonadIO m) => e -> String -> m Bool

Does the given element have a particular class?