CODEWITHSUNDEEP
javascriptyui
Robert
Robert

Reputation: 1638

Getting a Simple YUI Example to Work

I'm reading over the "Getting Started" part of YUI and I can't get the basics to work. What am I doing wrong in this code sample that won't allow this contentNode to print? When I try to view it in the browser, nothing happens.

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>YUI</title>
<script src="http://yui.yahooapis.com/3.7.3/build/yui/yui-min.js"></script>
<script>
YUI().use('node', function (Y) {

    // Create DOM nodes.
    var contentNode = Y.Node.create('<div>');

    contentNode.setHTML('<p>Node makes it easy to add content.</p>');
});
</script>
</head>
<body>

</body>
</html>

Upvotes: 3

Views: 1588

Answers (1)

Clarence Leung
Clarence Leung

Reputation: 2556

This is just something that might not have been clear with the "Getting Started" section of YUI, but Y.Node.create makes a Node object, but doesn't attach it to the DOM yet. If you want to do that, just add one more line to your code to do so (such as append/prepend/insert/etc.):

<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
    <title>YUI</title>
    <script src="http://yui.yahooapis.com/3.7.3/build/yui/yui-min.js"></script>
    <script>
      YUI().use('node', function (Y) {

          // Create DOM nodes.
          var contentNode = Y.Node.create('<div>');
          contentNode.setHTML('<p>Node makes it easy to add content.</p>');

          // Attaches created node to the DOM
          Y.one('body').append(contentNode);
      });
    </script>
  </head>
  <body>

  </body>
</html>

Upvotes: 5

Related Questions