tag - ¿Cómo puedo eliminar los espacios en blanco iniciales de mi bloque<pre>/<code> sin eliminar la sangría en mi HTML?
white-space css (3)
Aquí tienes, decidí encontrar algo más concreto que cambiar la forma en que funcionan el code o el pre . Así que hice algunas expresiones regulares para obtener el primer carácter de nueva línea /n (precedido de posibles espacios en blanco: la /s* se usa para limpiar espacios en blanco adicionales al final de una línea de código y antes del carácter de nueva línea (que noté que tenía el suyo)) y busque la tabulación o los caracteres de espacio en blanco que la siguen [/t/s]* (que significa el carácter de tabulación, el carácter de espacio en blanco (0 o más) y establezca ese valor en una variable. Esa variable se utiliza en la función de reemplazo de expresiones regulares para encontrar todos instálelas y reemplácelas con /n (nueva línea). Dado que la segunda línea (donde se establece el pattern ) no tiene la bandera global (una g después de la expresión regular), encontrará la primera instancia del carácter de nueva línea /n y establezca la variable de pattern a ese valor. Entonces, en el caso de una nueva línea, seguida de 2 caracteres de tabulación, el valor del pattern será técnicamente /n/t/t , que se reemplazará donde se encuentre cada carácter de /n elemento de pre code (ya que se ejecuta a través de cada función) y se reemplaza con /n
$("pre code").each(function(){
var html = $(this).html();
var pattern = html.match(//s*/n[/t/s]*/);
$(this).html(html.replace(new RegExp(pattern, "g"),''/n''));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<body>
Here is some code:
<pre><code>
Here is some fun code!
More code
One tab
One more tab
Two tabs and an extra newline character precede me
</code></pre>
</body>
Esta pregunta ya tiene una respuesta aquí:
Tengo el siguiente HTML:
/ block without removing indentation in my HTML?">
Esto funciona, asumiendo que la sangría debe basarse en la primera línea de código:
//get the code element:
var code= document.querySelector(''pre code'');
//insert a span in front of the first letter. (the span will automatically close.)
code.innerHTML= code.textContent.replace(/(/w)/, ''<span>$1'');
//get the new span''s left offset:
var left= code.querySelector(''span'').getClientRects()[0].left;
//move the code to the left, taking into account the body''s margin:
code.style.marginLeft= (-left + code.getClientRects()[0].left)+''px'';
code {
display: block; //this is necessary for the JavaScript to work properly
}
<body>
Here is some code:
<pre><code>
Here is some fun code!
And some more!
Continuing
Wrapping up
Closing code now.
</code></pre>
</body>