javascript / jquery извлечь HTML-текст из таблицы HTML, содержащей входные теги - PullRequest
Новая
       3

javascript / jquery извлечь HTML-текст из таблицы HTML, содержащей входные теги

0 голосов
/ 23 июня 2009

У меня большая проблема. Я хочу извлечь текст из HTML-таблицы, которая содержит входные теги, необработанный текст, теги ссылок и т. Д. И отобразить в новом окне чистой HTML-таблицы только с текстом.

ОБРАЗЕЦ ВХОДА 

<TABLE id="test">
<TBODY>
<TR>
<TD>TEXT 1</TD>
<TD><a href="/questions">TEXT 2</a></TD>
<TD><input  type="text" value="TEXT 3" ></TD>
</TR>
</TBODY>
</TABLE>

здесь происходят магические вещи (сценарий) (разбор) (это)

OUTPUT 

<TABLE  id="test">
<TBODY>
<TR>
<TD>TEXT 1</TD>
<TD>TEXT 2</TD>
<TD>TEXT 3</TD>
</TR>
</TBODY>
</TABLE>

Я искал почти везде, и я не могу заставить его работать. Мне нужна эта функциональность для копирования вставки.

Любая помощь.

Ответы [ 2 ]

6 голосов
/ 23 июня 2009

Чтобы извлечь только текст из чего-либо, используйте метод .text(). Чтобы получить значение для ввода, используйте метод .val().

Итак, нам нужно перебрать каждую ячейку <TD>, и внутри каждой из них, если есть вход, получить значение. Мы соединяем их вместе и помещаем обратно в ячейку, используя метод .html().

Вот код: 

$(document).ready(function(){
    var tmp = '';
    $('table tbody tr td').each(function () {
        tmp = $(this).text();
        $(this).find('input').each(function () {
                tmp += $(this).val();
        });
        $(this).html(tmp);
    });
});

Чтобы узнать больше о методах jQuery, см. http://api.jquery.com/

1 голос
/ 23 июня 2009

Спасибо @ artlung

На основании вашего образца я подготовил полное решение (скопировать вставить в HTML-файл)

И я прошу рассмотреть это, может быть, это можно сделать лучше?

Полная задача:

1.Преобразовать таблицу HTML с входными данными, привязкой, текстом в новую таблицу CLEAN Html только с текстом

2.Создать новое окно и передать подготовленный стол

РЕШЕНИЕ: 

<html>
<head>
<title>TEST HTML table with inputs , anchor to text </title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
var tmp = '';

$('table tbody tr').each(function () {   //iterate tr
tmp += '<tr>';  
$(this ).find('td').each(function () {  //iterate td
    tmp += '<td>';
    tmp += $(this).text();
    $(this).find('input').each(function () {
            tmp += $(this).val() ;
        tmp += '</td>'; 
    });
});
tmp += '</tr>'; 
});


$("#demo_button").click(function(e) {
myWindow=window.open('','MyNewWindow','width=500,height=300,left=200,top=100');
myWindow.document.write('<html><head><title>CTRL+C to copy</title></head><body><table><tbody>'  + tmp +  '</tbody></table></body></html>');
myWindow.document.close();
myWindow.focus(); 
});

});
</script>
</head>
<body>
<div>
<input type="button" id="demo_button" value="Click Me to open window with clean HTML TABLE prepared for copy"/>

<br/>This is HTML TABLE:
<TABLE id="test">
<TBODY>
<TR> <TD><b>TEXT 1</b></TD> <TD><a href="#">TEXT 2</a></TD> <TD><input  type="text" value="TEXT 3" ></TD> </TR>
<TR> <TD><span>TEXT 1.1</span></TD> <TD><a href="#">TEXT 2.1</a></TD> <TD><input  type="text" value="TEXT 3.1" ></TD> </TR>
</TBODY>
</TABLE>

</div>
</body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...