码迷,mamicode.com
首页 > 其他好文 > 详细

chrome36可以使用自定义元素的回调了

时间:2014-09-02 22:52:45      阅读:172      评论:0      收藏:0      [点我收藏+]

标签:style   io   使用   ar   div   cti   log   html   on   

<!DOCTYPE html>
<html>
    <head>
        <title>ms-attr-*</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width">
        <script src="avalon.js"></script>

        <script>
            avalon.define("test", function(vm) {
                vm.toggle = true
                vm.aaa = "aaa"
                vm.click = function() {
                    vm.toggle = !vm.toggle
                    console.log(vm.toggle)
                }
                vm.change = function() {
                    vm.aaa = "bbb"
                }
            })
            var XBooPrototype = Object.create(HTMLElement.prototype);

            XBooPrototype.detachedCallback = function() {
                console.log("remove")
            }
            XBooPrototype.attachedCallback = function() {
                console.log("add")
            }
            var XBoo = document.registerElement(‘x-boo-ir2‘, {
                prototype: XBooPrototype
            });
       
            window.onload = function() {
                var xboo = new XBoo()
                var body = document.body
                body.appendChild(xboo);

                body.removeChild(xboo);
            }

        </script>
        <style>
            .aaa {
                background: goldenrod;
            }
            .bbb{
                background: green;
            }
        </style>

    </head>
    <body ms-controller="test">

        <div ms-hover="{{aaa}}:toggle" ms-click="click">ddddd</div>
        <button ms-click="change">点我</button>
    </body>
</html>

chrome36可以使用自定义元素的回调了

标签:style   io   使用   ar   div   cti   log   html   on   

原文地址:http://www.cnblogs.com/rubylouvre/p/3952395.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!