切图网项目中遇到的，需要把注册登录功能封装到一个js文件，但是登录注册中又有下拉模糊查询等js交互，需要依赖对应的jquery插件，所以在封装的js的时候，对于第三方的插件文件需要通过js文件来进行加载，这样有利于维护，减少js文件的引用，附代码亲测可用。

/*加载必要的文件*/
$.getScript('js/select2-4.0.13.full.min.js',function(){

$('head').append('<link rel="stylesheet" type="text/css" href="css/select2-4.0.13.min.css"/>');
$('head').append('<style>'+
'.m-lay-loginnew .select2-container .select2-selection--single{ height: 40px; border: #e5e3e4 solid 1px !important; border-radius: 10px 0 0 10px !important;}'+
'.m-lay-loginnew .select2-container--open .select2-selection--single{ border: #718fb0 solid 1px !important; background: #eff3f6; color: #666;}'+
'.m-lay-loginnew .select2-container--default .select2-selection--single .select2-selection__rendered{ line-height: 38px; font-size: 14px;}'+
'.m-lay-loginnew .select2-container--default .select2-selection--single .select2-selection__arrow{ display: none;}'+
'.registerAreaCodeDropdown{ width: 500px !important; border: 1px solid #e5e5e5 !important; top: 8px; }'+
'.registerAreaCodeDropdown .select2-results__option{ font-size: 14px; color: #333;}'+
'.registerAreaCodeDropdown .select2-results__option--highlighted[aria-selected]{ background: #f8f8f8; color: #333; }'+
'</style>');

动态加载js文件用到的是jquery自带的getScript方法，因为涉及到动态加载js文件后执行js中的方法，getScript可以实现js文件加载完以后执行非常的好用，而动态加载css则比较简单的了，用的是jquery追加元素的方法实现。

最后，需要注意的是getScript加载js文件路径是相对于当前页面而言的，而不是相对于当前的js文件。

标签：jquery, 动态加载js