This example demonstrates how to retrieve and use a `Node` instance and access DOM properties.

Press a button to get or set the `offsetWidth` of the `div` containing the corn image.

{{>properties-source}}
Image derived from "ear of corn", by normanack

Setting up the HTML

```
? px
px ```

Getting a Node Instance

The `Y.one` method accepts a Selector or HTML element and returns a Node instance. First we'll set up some variables for the node's representing our HTML.

``` var corn = Y.one('#corn'), input = Y.one('.example #input'), output = Y.one('.example #output'); ```

Accessing Node Properties

The properties of a node can be accessed via its `set` and `get` methods.

In most cases, simple type of properties (strings, numbers, Booleans) pass directly to/from the underlying DOM node, however properties representing other DOM nodes return `Node` or `NodeList` instances.

The Get Method

We can use the `get` method to read the `offsetWidth` of the `div` containing the corn image, which includes the style width, padding, and border.

``` width = corn.get('offsetWidth'); ```

The Set Method

The Set method can be used to set the value of objects

``` input.set('value', 237); ```

The `offsetWidth` property of an HTML element is read only, however YUI makes this writeable. This assures that the final `offsetWidth` matches the value that is set, regardless of borders, padding, or box model.

``` corn.set('offsetWidth', value); ```

Listening for Node Events

We will update the value `offsetWidth` property of the `div` containing the corn image when the Set button is pressed.

``` Y.one('.example .btn-set').on('click', function(e) { ... corn.set('offsetWidth', value); ... }; ```

Complete Example Source

``` {{>properties-source}} ```