Как получить raw-содержимое тега html?
Очень простая задача. Есть тег DIV, в нем содержится некий произвольный html-код, например:
<div class="add-html-code test-mar"> <b>Пример кода:</b> <p>1 < 2 + 3 > 4 = 5 : 6 * 7 / 8 \ 9 - 0</p> <img class="rounded" src="samples/001_p.jpg" alt="" /> <img class="rounded-top" src="samples/002_p.jpg" alt="" /> <img class="rounded-right" src="samples/003_p.jpg" alt="" /> <img class="rounded-bottom" src="samples/004_p.jpg" alt="" /> <img class="rounded-left" src="samples/005_p.jpg" alt="" /> <img class="rounded-circle" src="samples/006_p.jpg" alt="" /> <img class="rounded-pill" src="samples/007_p.jpg" alt="" /> <img class="rounded-0" src="samples/008_p.jpg" alt="" /> </div> Нужно получить содержимое тега DIV в неизменном виде. То есть, в строковую переменную должен быть помещен такой текст: Код:
<b>Пример кода:</b>Функция .html() преобразует код, она не подходит (как я понял). Пропадает закрывающая косая черта для одиночных тегов (в примере IMG), а это существенно! Вот что возвращает .html(): Код:
<b>Пример кода:</b> |
Смените контейнер с div'а на textarea или на script[type=text/html].
|
new XMLSerializer().serializeToString(element);если вам нужно, чтобы это был XML, поскольку в HTML5 это не имеет смысла, там определён словарь элементов и HTML5 знает, что img одиночный элемент |
Очень простая задача. Есть тег DIV, в
В нем уже не содержится нужный тебе код. Парсер браузера его исправил в момент разбора(обработки) ответа/вставки. Но если очень нужно можно снова получить эту страницу в виде простого текста и поискать там нужный исходный текст $.get( location.href ,p=>alert( p )); |
MallSerg,
вот это правильный ответ. Спасибо, понял корень зла ;) Придется изобретать велосипед для фиксации одиночных тегов после парсинга. Тогда вопрос: как на JS регекспом в тексте добавить "/" в конце одинарных тегов? meta, img, link, br, hr, input, area, param, col, base |
Roman Koff,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<textarea name="" rows="50" cols="100"></textarea>
<div class="add-html-code test-mar">
<b>Пример кода:</b>
<p>1 < 2 + 3 > 4 = 5 : 6 * 7 / 8 \ 9 - 0</p>
<img class="rounded" src="samples/001_p.jpg" alt="" />
<img class="rounded-top" src="samples/002_p.jpg" alt="" />
<img class="rounded-right" src="samples/003_p.jpg" alt="" />
<img class="rounded-bottom" src="samples/004_p.jpg" alt="" />
<img class="rounded-left" src="samples/005_p.jpg" alt="" />
<img class="rounded-circle" src="samples/006_p.jpg" alt="" />
<img class="rounded-pill" src="samples/007_p.jpg" alt="" />
<img class="rounded-0" src="samples/008_p.jpg" alt="" />
</div>
<script>
var html = document.querySelector('.add-html-code.test-mar').innerHTML
var reg = new RegExp('('+'meta, img, link, br, hr, input, area, param, col, base'.split(', ').join('|')+')[^>]+', 'mig');
html = html.replace(reg, '$& /');
function htmlspecialchars_decode(string, quote_style) {
var optTemp = 0,
i = 0,
noquotes = false;
if (typeof quote_style === 'undefined') {
quote_style = 2;
}
string = string.toString()
.replace(/</g, '<')
.replace(/>/g, '>');
var OPTS = {
'ENT_NOQUOTES': 0,
'ENT_HTML_QUOTE_SINGLE': 1,
'ENT_HTML_QUOTE_DOUBLE': 2,
'ENT_COMPAT': 2,
'ENT_QUOTES': 3,
'ENT_IGNORE': 4
};
if (quote_style === 0) {
noquotes = true;
}
if (typeof quote_style !== 'number') { // Allow for a single string or an array of string flags
quote_style = [].concat(quote_style);
for (i = 0; i < quote_style.length; i++) {
// Resolve string input to bitwise e.g. 'PATHINFO_EXTENSION' becomes 4
if (OPTS[quote_style[i]] === 0) {
noquotes = true;
} else if (OPTS[quote_style[i]]) {
optTemp = optTemp | OPTS[quote_style[i]];
}
}
quote_style = optTemp;
}
if (quote_style & OPTS.ENT_HTML_QUOTE_SINGLE) {
string = string.replace(/�*39;/g, "'"); // PHP doesn't currently escape if more than one 0, but it should
// string = string.replace(/'|�*27;/g, "'"); // This would also be useful here, but not a part of PHP
}
if (!noquotes) {
string = string.replace(/"/g, '"');
}
// Put this in last place to avoid escape being double-decoded
string = string.replace(/&/g, '&');
return string;
}
document.querySelector('textarea').value = htmlspecialchars_decode(html) ;
</script>
</body>
</html>
|
Цитата:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<textarea rows="50" cols="100"></textarea>
<div class="add-html-code test-mar">
<b>Пример кода:</b>
<p>1 < 2 + 3> 4 = 5 : 6 * 7 / 8 \ 9 - 0</p>
<img class="rounded" src="samples/001_p.jpg" alt="" />
<img class="rounded-top" src="samples/002_p.jpg" alt="" />
<img class="rounded-right" src="samples/003_p.jpg" alt="" />
<img class="rounded-bottom" src="samples/004_p.jpg" alt="" />
<img class="rounded-left" src="samples/005_p.jpg" alt="" />
<img class="rounded-circle" src="samples/006_p.jpg" alt="" />
<img class="rounded-pill" src="samples/007_p.jpg" alt="" />
<img class="rounded-0" src="samples/008_p.jpg" alt="" />
</div>
<script>
var html = document.querySelector(".add-html-code.test-mar");
document.querySelector("textarea").value = new XMLSerializer()
.serializeToString(html)
.replace(/^<[^>]+>\s*\r?\n|<\/[^>]+>$/g, "");
</script>
</body>
</html>
Рег. выр. в данном случае удаляет обёртку <div class="add-html-code test-mar"> рони, а зачем вам htmlspecialchars_decode, оно же может получиться так... htmlspecialchars_decode("<code><script>alert ('🍑');</script></code>") |
Цитата:
|
Цитата:
|
Спасибо за ценные советы!
В итоге заюзал .html() для получения содержимого и преобразование для добавления "/" вконце одиночных тегов: return this.replace(/<((meta|img|link|br|hr|input|area|param|col|base).*?)>/g, '<$1 />'); |
| Часовой пояс GMT +3, время: 10:18. |