H5W3
当前位置:H5W3 > 其他技术问题 > 正文

js绑定 div内容!求大神帮我分析这段代码

//在HTML中有如下代码,为两个空的div
      <div id="country-menu" class="country-left"></div>
      <div class="country-right"></div>
//当页面加载时:div中的 ul  li 包括 汉字内容都出来了!帮我分析一下,这些代码是用什么技术写的  和最下面绑定文字内容的路径,在项目中如何找(idap.config.baseUrl() + '/criteria/countryTradetype'

    CriteriaCountry.prototype = {
        init : function (data) {
            if (!data || data.length <= 0) return;
            var $content = $('.country-right').addClass('tab-content'),
                 $ul = $('<ul />',{'class':'tab'});
            this.el.append($ul);
            this.el.on('show.idap.tab','[data-toggle="tab"]',function(e) {
                if (e.relatedContent) {
                    var $relatedContent = $(e.relatedContent),
                        isLoad = $relatedContent.data('isLoad');
                    !isLoad && _fnCountry.apply($relatedContent);
                }
              });
              var $firsta;
            for (var i=0; i<data.length; i++) {
                var code = data[i].code, id = 'Tb'+code, text = data[i].name,
                $li = $('<li />'),
                $a = $('<a />',{'href':'#'+id, 'text':text, 'data-toggle':'tab'}),
                $div = $('<div />',{'id':id,'class':'tab-panel country-list','data-code':code});
                 $ul.append($li.append($a));
                 $content.append($div);
                 i == 0 && ($firsta = $a);
            }
            var self = this;
            self.request(idap.config.baseUrl() + '/criteria/countryTradetype',function(data){
                countryTradetypes = data;
                self.request(idap.config.baseUrl() + '/criteria/countryPower',function(data){
                    countryPowers = data;
                    $firsta && idap.tab.call($firsta);
                });
            }); 
        },
        request : function(url,callback){
            idap.ajax.request({url : url}, {
                success : function(data) {
                    if (data && data.code == '2001') {
                        var ddata = data.data || [];
                        callback && callback(ddata);
                    };
                }
            });
        }
    }; 

回答:

…………………..
这个问题。。。
用到jquery的技术,$(xxx)是把xxx转换成jquery对象操作
CriteriaCountry.prototype = {xxx} 用的是js技术,这么写就是创建个对象叫做CriteriaCountry.prototype
估计在别的地方调用 CriteriaCountry.prototype对象的init方法和request方法,
init方法里面,用到了vue.js的双向绑定,
就是,当数据变化的时候,页面上的元素自动跟着变化
核心就是vue.js
说实话,这作者这么写,复杂了,vue的绑定,可以做到超级优雅的

回答:

只是用juery创建的ui和li,如果不明白可以去 http://www.w3school.com.cn/和jquery官网学习一下jd和jquery创建dom

本文地址:H5W3 » js绑定 div内容!求大神帮我分析这段代码

评论 0

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址