javascript - 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的绑定，可以做到超级优雅的

这篇关于javascript - js绑定 div内容！求大神帮我分析这段代码的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！