Спасибо, Рони за время, но немного не то.
Сообщение от Stenli
|
Но при конвертации исчезают теги <head>, <body>, <html> при этом все их содержимое остается, хотя я jQuery такого не просил. А потому я не могу извлечь содержимое <body>.
|
Смотрите, то есть, если на старте имеем:
<doctype! html>
<head>
<meta example 1>
<meta example 2>
<link example 1>
<link example 2>
</head>
<body>
<div>
example 1
</div>
<div>
example 2
</div>
</body>
</html>
То после конвертации получаем:
<meta example 1>
<meta example 2>
<link example 1>
<link example 2>
<div>
example 1
</div>
<div>
example 2
</div>
Куда-то исчезают <body>, <head>, в итоге в JS-код они не попадают и я не могу от них оттолкнуться, чтобы захватить то, что внутри них.
Как правильно заметил Рони, тут браузер что-то химичит, считая <body> внутри <textarea> лишним... наверное.
Полный HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="assets/css/bootstrap/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="assets/css/main.css">
<script type="text/javascript" src="assets/js/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script type="text/javascript" src="assets/js/bootstrap.min.js"></script>
<script type="text/javascript" src="assets/js/preland.js"></script>
<title>Preland convert</title>
</head>
<body>
<div class="container">
<div class="row">
<div class="text-center" style="margin-top: 20px;">
<button type="button" name="sendTo" value="Send to" id="sendTo" class="btn btn-success">Адаптировать</button>
</div>
<div class="text-center" style="font-size: 12px; margin: 10px;">Каждый новый текст требует обновления страницы (F5 на клавиатуре или кнопка обновить <span class="glyphicon glyphicon-repeat"></span>)</div>
<hr />
<div class="col-lg-12">
<label>Введите html-текст, который нужно адаптировать (правая кнопка мыши + вставить или Ctrl+V)</label>
<textarea class="form-control" name="insertArea" id="insertArea" cols="80" rows="10">
</textarea>
</div>
<div class="col-lg-12" style="margin-top: 10px;">
<label>Скопируйте/вырежьте адаптированный html-текст (правая кнопка мыши + копировать или Ctrl+C/X)</label>
<textarea class="form-control" name="pastArea" id="pastArea" cols="80" rows="10"></textarea>
</div>
<br>
</div>
</div>
</body>
</html>
Полный JS:
$(document).ready(function() {
var Final = '';
$('#sendTo').on('click', function () {
var insertData = $('#insertArea').val();
var bodyVal = $("<body>", {html : insertData});
var div = $("<div>", {html : insertData});
// only body content with internal tags
$(div).empty();
$(div).remove();
$(div).html(bodyVal);
// find and replace all href links to {{ $landing_url }}
$('a', div).attr("href","{{ $landing_url }}");
// find and replace all img to {{ $landing_url }}
$('img', div).each(function (i,el) {
var srcVal=el.src.substr(el.src.lastIndexOf("/")+1,el.src.length);
$(this).attr("src","{{ asset('layers/'. $template_folder .'/img/" + srcVal + "') }}");
});
// delete tag script, iframe, noscript with content
$('script', div).empty();
$('noscript', div).empty();
$('iframe', div).empty();
$('script', div).remove();
$('noscript', div).remove();
$('iframe', div).remove();
// replace dates
var reg = /\d{2}\.\d{2}\.\d{4}/g;
$(div).html(function (a,h) {
return h.replace(reg, '<?=date('+'d.m.Y'+', strtotime('+'0 day'+'));?>');
});
// display result
Final += "@include('layers.header') <body> " + div.html() + " @include('layers.footer')";
$('#pastArea').val(Final);
});
});
Вопрос все тот же: как вытащить содержимое тега <body>?
Путаница может быть в том, что цель моего jQuery обработать не код своей страницы, а код помещенный в <textarea>.
И, да, простите за мою тупость - не сразу правильно поставил вопрос. Впрочем я и сейчас не уверен до конца, что все понятно.