01.12.2012, 04:17
|
Новичок на форуме
|
|
Регистрация: 01.12.2012
Сообщений: 7
|
|
помогите с innerHTML
добрый день уважаемые ...
я новичек,а точнее чайник.
очень буду благодарен если кто то поможет разобраться в следующем.
есть страница с элементом.
<p id="intro">
<a href="http://www.test.ru/1.jpg">
<img src="http://www.test.ru/1.jpg"></a>
</p>
вывожу элемент с помощью:
<script type="text/javascript">
txt=document.getElementById("intro").innerHTML;
document.write("txt);
</script>
вопрос
как вывести intro с другой удаленной страницы?
допустим с 1.html где есть id intro?
точнее, как jave обратиться к 1.html и найти там id intro?
заранее спасибо за любые ответы.
|
|
01.12.2012, 11:42
|
|
Профессор
|
|
Регистрация: 11.09.2010
Сообщений: 8,804
|
|
Делать асинхронный запрос к серверу (AJAX). Получать всю страницу и оттуда уже выдергивать нужную часть. Не рационально конечно, но если сервер не ваш, то только так (ну можно еще через curl на своем сервере делать запрос страницы, вырезать нужную часть, и в браузер отдавать только ее)
К слову, в jquery есть прозрачный способ получения элемента из страницы через асинхронный запрос - нужно всего лишь в качестве запрашиваемого URL указать site.ru/1.html#intro
|
|
01.12.2012, 13:42
|
Новичок на форуме
|
|
Регистрация: 01.12.2012
Сообщений: 7
|
|
Спасибо, сервер наш. Тоесть мне нужно получить элемент со страницы которая лежит на этом же серваке.
|
|
01.12.2012, 15:41
|
|
Профессор
|
|
Регистрация: 11.09.2010
Сообщений: 8,804
|
|
Тогда лучше написать серверный скрипт, который будет возвращать на запрос нужный кусок кода, и обращаться к этому скрипту посредством XMLHttpRequest
Кстати, если документ статичный, нельзя ли просто сохранять рядом нужный фрагмент кода в отдельный файл? Распишите свою задачу шире.
Последний раз редактировалось danik.js, 01.12.2012 в 15:43.
|
|
01.12.2012, 22:30
|
Новичок на форуме
|
|
Регистрация: 01.12.2012
Сообщений: 7
|
|
спасибо, может это можно и по другому реализовать, задача у меня такая. Мне нужно чтобы java выводил такой html код на каждую запись из mysql:
<a href="http://www.test.ru/3.jpg">
<img data-title="#99"
data-description="различное описание
<a href=page.html>больше инфо</a>"
data-layer="<p class='pric'>тескт</p>"
data-link="http://www.test.ru/page.php?id=99"
src="http://www.test.ru/3.jpg">
</a>
через document.write у меня не выходит, не пропускает спец символы типа #<:>.
весь этот html уже формируется php скриптом, теперь его весь нужно передать через java.
Парсить ничего не нужно, так как весь код html нужен целиком.
Последний раз редактировалось sergii, 01.12.2012 в 22:34.
|
|
02.12.2012, 01:02
|
|
Профессор
|
|
Регистрация: 11.09.2010
Сообщений: 8,804
|
|
Во-первых, java !== javascript
Во-вторых, зачем этот код выводить через javascript, почему сразу не генерировать страницу уже с этим кодом?
|
|
02.12.2012, 03:02
|
Новичок на форуме
|
|
Регистрация: 01.12.2012
Сообщений: 7
|
|
код html я уже сгенерировал php, тот же самый код нужно с генерировать с помощью javascript. Такое уж у меня задание. Мне нужно или взять готовый html с 1.php или полностью по новому генерировать html с помощью javascript. Думал сделать проще с помощью innerHTML - оказалось сложно с удаленной страницы. Вот ищу совета как легче.
|
|
02.12.2012, 03:49
|
|
Профессор
|
|
Регистрация: 11.09.2010
Сообщений: 8,804
|
|
Эффективнее конечно передать массив данных в формате JSON, и уже на клиенте сгенерировать нужную разметку или создавать элементы и атрибуты через API. Пишем скрипт, возвращающий массив, делаем к нему запрос через XMLHttpRequest , получаем ответ, парсим через JSON.parse() , пробегаемся по массиву в цикле, создаем элементы через innerHTML или document.createElement()
|
|
02.12.2012, 04:32
|
Новичок на форуме
|
|
Регистрация: 01.12.2012
Сообщений: 7
|
|
ух ты, таких матюгов я не слышал с момента распада СССР, может кто то хочет заработать и сделать это? А то умрет мечта ...
|
|
02.12.2012, 11:02
|
|
Профессор
|
|
Регистрация: 11.09.2010
Сообщений: 8,804
|
|
$data = array(
array(
'title' => '#99',
'description' => 'различное описание <a href=page.html>больше инфо</a>',
'layer' => '<p class='pric'>тескт</p>',
'link' => 'http://www.test.ru/page.php?id=99',
'src' => 'http://www.test.ru/3.jpg',
),
array(
'title' => '#99',
'description' => 'различное описание <a href=page.html>больше инфо</a>',
'layer' => '<p class='pric'>тескт</p>',
'link' => 'http://www.test.ru/page.php?id=99',
'src' => 'http://www.test.ru/3.jpg',
),
);
$response = json_encode($data);
header('Content-Type: application/json');
echo $response;
var dataRequest = new XMLHttpRequest();
dataRequest.onreadystatechange = function(){
if (this.readyState == this.DONE) {
if (this.status == 200) {
var data = JSON.parse(this.response);
process(data);
} else {
alert('Что-то пошло не так. Код ответа' +this.status);
}
}
};
dataRequest.open('GET', 'http://path/to/script.php');
dataRequest.send();
function process (data) {
if (!(data instanceof Array)) {
alert('какая-то хрень вместо данных');
return false;
}
for (var i = 0; i < data.length; i++)
{
var item = data[i];
var link, image;
link = document.createElement('a');
image = document.createElement('img');
image.setAttribute('data-title', item.title);
image.setAttribute('data-description', item.description);
image.setAttribute('data-layer', item.layer);
image.setAttribute('data-link', item.link);
image.src = item.src;
link.href = item.src;
link.appendChild(image);
document.body.appendChild(link);
}
}
Требуется маленький polyfill для IE7-8 (XMLHttpRequest)
Последний раз редактировалось danik.js, 04.12.2012 в 01:12.
|
|
|
|