Я хотел бы разместить содержимое файла внутри div и не использовать идентификаторы или классы, только с тегом script внутри body. Это мой код:Как разместить содержимое файла в div с помощью Javascript?
<div>
<span>hi, welcome to the </span>
<script>
// This is what I need
</script>
<span> season...</span>
</div>
Вы можете использовать JQuery AJAX для загрузки файла и использовать функцию document.write(), чтобы поместить содержимое в этом промежутке. Код:
<head>
...
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
</head>
<body>
...
<div>
<span>hi, welcome to the </span>
<script>
$.ajax({
async: false, // With this, you wait until the file is loaded
type: "GET", // If the file is large, use POST instead
url: "yoururl.txt", // Use the relative URL
dataType: "text",
success: function(LoadedFile) {
document.write(LoadedFile);
}
});
</script>
<span> season...</span>
</div>
...
</body>
ПРИМЕЧАНИЕ: Используйте вместо пробела «», чтобы заставить ваш браузер, чтобы использовать их.
НЕ ИСПОЛЬЗУЙТЕ document.write и не нуждайтесь в async false. См. Мой комментарий к вопросу – mplungjan
спасибо, этот тоже работает – Yukatanic45
@mplungian, почему бы не использовать его? – Yukatanic45
<div>
<span>hi, welcome to the </span>
<script>
var xhr = new XMLHttpRequest();
xhr.open('GET', '/filename.txt', false);
xhr.send(null);
if (xhr.readyState === 200)
document.write(xhr.responseText);
</script>
<span> season...</span>
</div>
Чтобы получить содержимое файла, который размещается на том же каталоге сайта вызывающему используйте XMLHttpRequest; как показано выше.
Кроме того, вам нужно сделать запрос synchronous, чтобы document.write содержимого файла в этом конкретном месте.
Запрос Ajax является асинхронным. AFAIK, используя 'document.write' после того, как документ будет готов, приведет к перезаписи всей страницы. Однако вы можете использовать 'document.write ('')' на загрузке страницы, что позволит вам узнать, где разместить контент после его получения. – blex
подумал об этом после того, как я разместил его. Я никогда не тестировал это. если он записывает вне порядка, он будет помещен в конец документа. он не будет «перезаписывать всю страницу». – xandercoded
jQuery отмечен. Почему бы не использовать его – mplungjan
Вот скрипт, который не требует замедленное document.write или синхронизации Ajax
<script>
document.write('<span id="inserted"></span>'); // inline so ok
$(function() { $("#inserted").load("myfile.html") });
<script>
In Plain JS использовать XMLHttpRequest и innerHTML, чтобы избежать Синхронизировать
Что вы пытаетесь до сих пор? И почему ограничения на использование идентификаторов или классов? –
Если вы написали код таким образом, ваше приложение/веб-страница будет трудно поддерживать и подвергать ошибкам BTW. Я предлагаю использовать правильный язык шаблонов или структуру. Для быстрого «грязного взлома» вы можете использовать document.write и загружать файлы с помощью AJAX. –
Возможно, '$ (" div> span: firstchild "). After (" ") .load (" myfile.html ")' или '$ .get (" myFile.html ", function (data) {$ (" ") .html(). InserAfter (" div> span: firstchild ")})' – mplungjan