hacer - modificar clase css jquery

$.getScript, pero para hojas de estilo en jQuery?

Question

El título lo dice todo. ¿Hay un equivalente de $.getScript en jQuery, pero para cargar hojas de estilo?

Answer 1

CSS no es un script, por lo que no tiene que "ejecutarlo" en el sentido de ejecución de script.

Básicamente, una etiqueta <link> creada sobre la marcha y anexada al encabezado debería ser suficiente, como

$(''<link/>'', {
   rel: ''stylesheet'',
   type: ''text/css'',
   href: ''path_to_the.css''
}).appendTo(''head'');

o

var linkElem = document.createElement(''link'');
document.getElementsByTagName(''head'')[0].appendChild(linkElem);
linkElem.rel = ''stylesheet'';
linkElem.type = ''text/css'';
linkElem.href = ''path_to_the.css'';

Si quieres hacerlo sin jQuery.

El navegador responderá al cambio en el DOM y actualizará el diseño de su página en consecuencia.

EDITAR :

He leído que el viejo Internet Explorer tiene problemas con esto, y es posible que tenga que hacerlo como respuesta para que funcione:

https://.com/a/2685639/618206

EDIT2 :

Leer el contenido del archivo y colocarlo en línea (entre las etiquetas <style> ) también es una solución válida, pero de esa manera el navegador no almacenará en caché el CSS.

Answer 2

He creado una alternativa a $.getScript que maneja hojas de estilo. Lo llamé $.getStylesheet por razones obvias.

Implementa el objeto $.Deferred , lo que significa que puedes encadenar cosas así:

$.when($.getStylesheet(''css/main.css''), $.getScript(''js/main.js''))
.then(function () {
  console.log(''the css and js loaded successfully and are both ready'');
}, function () {
  console.log(''an error occurred somewhere'');
});

Aquí está la pequeña función para $.getStylesheet . Se acaba de alojar en Github gist, así que puedo actualizarlo si lo necesito.

Answer 3

puede usar el mismo método $ .getScript para "descargar" la hoja de estilo, ya que $ .getScript en realidad es solo otra solicitud HTTP. pero estará un poco conectado ya que css no es ejecutable.