jQuery的createdimg插件可以幫助我們動(dòng)態(tài)生成圖片元素,非常方便實(shí)用。下面我們來了解一下它的使用方法。
$.fn.createdimg = function(options) { var settings = $.extend({ src: '', alt: '', title: '', class: '', id: '', width: '', height: '', style: '' }, options); var img = $(''); img.attr('src', settings.src); img.attr('alt', settings.alt); img.attr('title', settings.title); img.addClass(settings.class); img.attr('id', settings.id); img.attr('width', settings.width); img.attr('height', settings.height); img.attr('style', settings.style); $(this).append(img); }; 調(diào)用示例: $('#imgContainer').createdimg({ src:'img/test.png', alt:'測試圖片', title:'測試用圖片', class:'test-img', id:'testImg', height:'200px' });
以上的代碼中,我們先通過$.fn來擴(kuò)展了jQuery的方法,將我們的createdimg方法添加到j(luò)Query對(duì)象中。接著,我們使用$.extend函數(shù)來處理傳入的options參數(shù),設(shè)置了一些圖片的屬性。在接下來的代碼中,我們通過jQuery對(duì)象及方法來動(dòng)態(tài)的生成圖片元素,并將其添加到傳入的目標(biāo)容器中。
調(diào)用示例中,我們傳入了一個(gè)包含圖片屬性的對(duì)象,將其傳遞給createdimg方法進(jìn)行處理。最終,我們得到了一個(gè)包含了傳入屬性的圖片元素,并將其添加到了id為imgContainer的容器中。
上一篇判斷css文字多余省略
下一篇mysql一主兩從配置