Как импортировать html и вставить в div?

Я хотел бы вставить файл html в другой div в html-файле. Я не разбираюсь в javascript, и я прихожу с этой идеей.Как импортировать html и вставить в div?

<head> 
    <link rel="import" href="polymer/polymer.html" /> 
    <link rel="import" id="note-import-01" href="some.html" /> 
</head> 
<body> 
<div id="notes"> 
    <div id="blocker"></div> 
    <script type="text/javascript"> 
     var link = document.querySelector('#note-import-01'); 
     var content = link.importNode; 
     parent.insertBefore(content); 
    </script> 
</div> 
</body>

Однако оно не похоже на то, что я хочу. Например, div с блокировщиком идентификаторов не включал содержимое страницы. К сожалению, в здесь я имею в виду some.html в строке 3.

Обратите внимание, что

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

источник

2015-06-30 SHY.John

вы пытаетесь использовать полимер вставить другой HTML-файл? Или jQuery? Если это Polymer, вам нужно создать элемент или использовать шаблоны автоматического связывания. – anthony

@anthony Это html-файл –

Я понимаю, что это html-файл. Но я пытаюсь понять, если вы пытаетесь использовать Polymer для этого, или jQuery. – anthony

Вы можете попытаться загрузить ваш HTML файл some.html в текущей страницы используется .load() метод JQuery.

В приведенном ниже решении имеется якорный тег a, который имеет обработчик события click, а внутри обработчика загружена локальная страница html some.html.

JS код:

$(document).ready(function(){ 
     $('#aUrl').hide(); 
     $('#divPage').load(this.href); 
});

HTML код:

<div id="divPage"></div> 
    <a href="http://lesson8.blogspot.in/2012/06/bind-gridview-using-jquery.html" id="aUrl">Load Page</a>

Демо @ JSFiddle: http://jsfiddle.net/dreamweiver/dVPQw/740/

Примечание: выше jsfiddle не позволяет загрузить удаленный ресурс, но в вашем случае будет загружен локальный ресурс совершенно

источник

2015-06-30 13:23:16 dreamweiver

Я не просил щелкнуть на странице, потому что я не думаю, что читателям нравится щелкать слишком много. –

Апология, не видел этого. теперь он будет загружаться автоматически. http://jsfiddle.net/dreamweiver/dVPQw/740/ – dreamweiver

Ваше решение работает, но я немного изменился, чтобы избежать . Если вы не возражаете, см. Psssix.shyjohn.net/tp/matter-model-ideal-gases.html –

Добавьте jQuery на страницу, а затем используйте это с правильным URL вместо примера.

<script type="text/javascript"> 
    jQuery(document).ready(function(){ 
     jQuery("#blocker").load("yourURLHere"); 
    }); 
</script>

источник

2015-06-30 12:48:26 Jay

Вы можете использовать JQuery-х load

$("#blocker").load("polymer/polymer.html");

Или с равниной Javascript

var xhr= new XMLHttpRequest(); 
xhr.open('GET', 'polymer/polymer.html', true); 
xhr.onreadystatechange= function() { 
    if (this.readyState==4 && this.status==200)     
     document.getElementById('blocker').innerHTML= this.responseText; 
}; 
xhr.send();

источник

2015-06-30 12:49:40 prem89

Извините, я не имею в виду полимер. Он уже загружен на моей странице успешно. –

Да, я думал, что вы загружаете файл polymer.html .. Вы можете загрузить любой файл, если он длится с того же сервера – prem89

Странно, я заканчиваю цикл загрузки родительских страниц. –

Вы можете сделать это с HTMLImports как так:

<pre id="notes"></pre> 

<script> 
    function importLoaded(link, slctr) { 
    document.querySelector(slctr).appendChild(link.import.body); 
    } 
</script> 

<link href="polymer/bower.json" rel="import" onload="importLoaded(this, '#notes')">

источник

2015-07-01 02:01:39

Как импортировать html и вставить в div?

ответ

Смежные вопросы