Как скопировать содержимое HTML в новую вкладку
Я создаю веб-приложение, и мне нужно скопировать HTML-элемент div и все, что внутри него, на новую вкладку. Я пишу этот код на JavaScript. До сих пор я работал над созданием большого двоичного объекта, а затем создавал файл для загрузки. Этот подход копирует весь HTML-код, который мне нужен, НО он не копирует текст, который был введен в какие-либо текстовые поля. Насколько я понимаю, проблема в том, что введенный текст не является частью HTML-кода, поэтому его нельзя скопировать. Однако я не могу найти другого подхода к этому, пожалуйста, помогите. Спасибо
После того, как вы скопировали html, вам нужно будет просмотреть все поля ввода и прочитать их значение, чтобы вы могли применить их на новой вкладке.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
Вы можете использовать Element.setAttribute() для этих элементов до сериализации вашего дерева DOM. Например:
input.setAttribute("value", input.value)
Это скопирует изменяемое значение (не сериализуемое) в атрибут (который является сериализуемым).
Вот фрагмент демонстрации:
const input = document.querySelector('input');
console.info('initial:', input.outerHTML);
input.value = 'hello world';
console.info('before:', input.outerHTML);
input.setAttribute('value', input.value);
console.info('after:', input.outerHTML);<input type = "text">(Вдохновлено комментарием @vanowm)
Сначала скопируйте html (скажем, внутри DIV)
Затем вам нужно будет просмотреть все поля ввода и прочитать их значение, чтобы вы могли их применить.
Таким образом, код выглядит следующим образом (измените его в соответствии с вашими потребностями):
<div id=container><html>
<input type=text name=text1 id = "text1">
<br><input type=text name=text2 id = "text2">
</html></div>
<textarea id=target style = "width:100%;height:200px;"></textarea>
<input type=button name=go onclick = "trigger();" value = "Parse">
<script>
function trigger(){
target0=document.getElementById('container').innerHTML;
text1= document.getElementById("text1").value;
text2= document.getElementById("text2").value;
target0=target0.replace('id = "text1"', 'id = "text1" value = "' + text1 + '"');
target0=target0.replace('id = "text2"', 'id = "text2" value = "' + text2 + '"');
document.getElementById("target").innerHTML=target0;
}
</script>
Добро пожаловать в Stack Overflow. Пожалуйста, пройдите тур , чтобы узнать, как работает Stack Overflow, и прочитайте How to Ask о том, как улучшить качество вашего вопроса. Затем посетите справочный центр, чтобы узнать, какие вопросы актуальны на этом сайте.