PRE предназначен для сохранения пробелов в точности так, как он выглядит (если только он не изменен на white-space в CSS, который не обладает достаточной гибкостью для поддержки форматирования кода).
До
Форматирование сохраняется, но все отступы за пределами тега PRE сохраняются.Было бы неплохо сохранить пробельные символы, которые использовали бы расположение тега в качестве отправной точки.
После
Содержаниевсе еще отформатирован как объявлено, но лишние начальные пробелы, вызванные положением тега PRE в документе, удаляются.
Я создал следующий плагин длярешить проблему с желанием удалить лишние пробелы, вызванные отступом контура документа.Этот код использует первую строку внутри тега PRE, чтобы определить, насколько он был отступ только из-за отступа в документе.
Этот код работает в IE7, IE8, IE9, Firefox и Chrome.Я кратко проверил это с библиотекой Prettify , чтобы объединить сохраненное форматирование с красивой печатью.Убедитесь, что первая строка внутри PRE фактически представляет базовый уровень отступа, который вы хотите игнорировать (или вы можете изменить плагин, чтобы сделать его более интеллектуальным).
Это грубый код,Если вы обнаружили ошибку или она работает не так, как вы хотите, пожалуйста, исправьте / прокомментируйте;не просто понизитьЯ написал этот код, чтобы исправить проблему, с которой столкнулся, и я активно его использую, поэтому мне бы хотелось, чтобы он был максимально надежным!
/*!
*** prettyPre ***/
(function( $ ) {
$.fn.prettyPre = function( method ) {
var defaults = {
ignoreExpression: /\s/ // what should be ignored?
};
var methods = {
init: function( options ) {
this.each( function() {
var context = $.extend( {}, defaults, options );
var $obj = $( this );
var usingInnerText = true;
var text = $obj.get( 0 ).innerText;
// some browsers support innerText...some don't...some ONLY work with innerText.
if ( typeof text == "undefined" ) {
text = $obj.html();
usingInnerText = false;
}
// use the first line as a baseline for how many unwanted leading whitespace characters are present
var superfluousSpaceCount = 0;
var currentChar = text.substring( 0, 1 );
while ( context.ignoreExpression.test( currentChar ) ) {
currentChar = text.substring( ++superfluousSpaceCount, superfluousSpaceCount + 1 );
}
// split
var parts = text.split( "\n" );
var reformattedText = "";
// reconstruct
var length = parts.length;
for ( var i = 0; i < length; i++ ) {
// cleanup, and don't append a trailing newline if we are on the last line
reformattedText += parts[i].substring( superfluousSpaceCount ) + ( i == length - 1 ? "" : "\n" );
}
// modify original
if ( usingInnerText ) {
$obj.get( 0 ).innerText = reformattedText;
}
else {
// This does not appear to execute code in any browser but the onus is on the developer to not
// put raw input from a user anywhere on a page, even if it doesn't execute!
$obj.html( reformattedText );
}
} );
}
}
if ( methods[method] ) {
return methods[method].apply( this, Array.prototype.slice.call( arguments, 1 ) );
}
else if ( typeof method === "object" || !method ) {
return methods.init.apply( this, arguments );
}
else {
$.error( "Method " + method + " does not exist on jQuery.prettyPre." );
}
}
} )( jQuery );
Затем этот плагин можно применить сстандартный селектор jQuery:
<script>
$( function() { $("PRE").prettyPre(); } );
</script>