jQuery: creare dinamicamente un capolettera

jQuery: creare dinamicamente un capolettera

In jQuery è semplice creare un capolettera dinamicamente.

La soluzione è la seguente:


(function( $ ) {
  $.fn.cap = function( options ) {
      options = $.extend({
        cssClass: "cap"
      }, options);
      return this.each(function() {
          var element = this,
              $element = $( element );
          if( element.firstChild && element.firstChild.nodeType === 3 ) {
              var text = element.firstChild.nodeValue;
              var firstLetter = text.charAt( 0 );
              var html = $element.html();
              $element.html( html.replace( firstLetter, '<span class="' + options.cssClass + '">' + firstLetter + '</span>' ) );
          }
      });
  };
})( jQuery );

Questa soluzione è necessaria nel caso in cui lo pseudo-elemento CSS :first-letter non è sufficiente a livello di proprietà supportate.

Torna su