Загрузите содержимое результатов php alexa с параметрами на html-странице — возможно, используя jquery или ajax

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

<?php
$url=$_GET["url"];
$xml = simplexml_load_file('http://data.alexa.com/data?cli=10&dat=snbamz&url='.$url);
$rank=isset($xml->SD[1]->POPULARITY)?$xml->SD[1]->POPULARITY->attributes()->TEXT:0;
echo $rank;
?>

Я могу загрузить это на свой сервер и вызвать что-то вроде rank.php? Url = google.com

Это возвращает число на экране (в данном случае 1). Так как мне получить этот номер в нормальном <p> тег в HTML-документе.

Т.е. <p>Alex rank: </p>

Я смотрю в jquery и использую метод get, но теряюсь.

например, положить это в <head></head> теги

<script>
$(document).ready(function(){
$("#div1").load("code/rank.php?url=google.com");
});
</script>

Тогда в моей HTML-странице добавления

<p>Alex rank: <div id="div1"></div></p>

не работает для меня

Я также попытался добавить следующий скрипт в <p></p> тег.

 <script type="text/javascript">
function showGetResult( name )
{
jQuery.ajax({
url: 'code/rank.php?url=google.com',
type: 'get',
dataType: 'text/html',
success:function(data)
{
alert(data);
document.write(data);
}
});
}

showGetResult('test');
</script>

Я просто хочу простое решение, чтобы потянуть это число.

Любая помощь с благодарностью.

1

Решение

 jQuery.ajax({
url: 'code/rank.php?url=google.com',
type: 'get',
dataType: 'text/html',
success:function(data)
{
alert(data);
document.write(data);
}
});

Я сделал несколько тестов — и кажется, что это виновник:
dataType: ‘text / html’

Зачем:
в документации jQuery — у http://api.jquery.com/jQuery.ajax/

Допустимые значения dataType:

  • «XML»

  • «HTML»

  • «JSON»

  • «JSONP»

  • «текст»

  • несколько разделенных пробелами значений

Я старался
dataType: ‘text’

Работал на меня.

Не забудьте поставить свой скрипт скрипт после

если вы выполняете его на своей странице

<p>Alexa rank: <span id="div-1"></span></p>

<script>
jQuery.ajax({
url: 'code/rank.php?url=google.com',
type: 'get',
dataType: 'text',
cache: false,
success: function(data)
{
alert(data);

// comment: $('#div-1').html(data)
// inserts data inside $('#div-1')
$('#div-1').html(data);
}
});
</script>

Но более чистый способ сделать это:

<html>
<head>
<script>

// comment:
//     in jQuery
//         $( yourFunction )
//     is a shortcut for
//         $(document).ready( yourFunction )
$(function(){
jQuery.ajax({
url: 'code/rank.php?url=google.com',
type: 'get',
dataType: 'text',
cache: false,
success: function(data)
{
alert(data);

// comment: $('#div-1').html(data)
// inserts data inside $('#div-1')
$('#div-1').html(data);
}
});
});
</script>
</head>
<body>
<p>Alexa rank: <span id="div-1"></span></p>
</body>
</html>

В этом последнем коде я использую кеш: ложь потому что я чувствую, что это хорошо для этого случая. я использую dataType: ‘text’ потому что вы ожидаете только число — так почему бы и нет? Мне просто больше поцелуя. Возможно, это будет работать с ‘HTML’.

Кстати, может быть другое место, где может быть скрыта другая ошибка:
код / ​​rank.php? URL = google.com

Если ваш текущий URL
www.example.com/somefolder/
тогда это будет интерпретироваться как
www.example.com ** / SomeFolder / ** / Код rank.php? URL = google.com

Если ваш текущий URL-адрес www.example.com/somefolder/another/
тогда это будет интерпретироваться как
www.example.com ** / SomeFolder / другое / ** / Код rank.php? URL = google.com

Мой совет — вы всегда можете использовать Firefox или Google Chrome Developer Tools> Network, чтобы увидеть, что возвращает ваш ajax-запрос — «1» или «PAGE 404 NOT FOUND» ^ _ ^
jQuery.ajax ({
url: ‘code / rank.php? url = google.com’,
тип: «получить»,
dataType: ‘text / html’,
успех: функция (данные)
{
Оповещение (данные);
document.write (данные);
}
});

Я сделал несколько тестов — и кажется, что это виновник:
dataType: ‘text / html’

Зачем:
в документации jQuery — у http://api.jquery.com/jQuery.ajax/

Допустимые значения dataType:

  • «XML»

  • «HTML»

  • «JSON»

  • «JSONP»

  • «текст»

  • несколько разделенных пробелами значений

Я старался
dataType: ‘text’

Работал на меня.

Не забудьте поставить свой скрипт скрипт после

если вы выполняете его на своей странице

<p>Alexa rank: <span id="div-1"></span></p>

<script>
jQuery.ajax({
url: 'code/rank.php?url=google.com',
type: 'get',
dataType: 'text',
cache: false,
success: function(data)
{
alert(data);

// comment: $('#div-1').html(data)
// inserts data inside $('#div-1')
$('#div-1').html(data);
}
});
</script>

Но более чистый способ сделать это:

<html>
<head>
<script>

// comment:
//     in jQuery
//         $( yourFunction )
//     is a shortcut for
//         $(document).ready( yourFunction )
$(function(){
jQuery.ajax({
url: 'code/rank.php?url=google.com',
type: 'get',
dataType: 'text',
cache: false,
success: function(data)
{
alert(data);

// comment: $('#div-1').html(data)
// inserts data inside $('#div-1')
$('#div-1').html(data);
}
});
});
</script>
</head>
<body>
<p>Alexa rank: <span id="div-1"></span></p>
</body>
</html>

В этом последнем коде я использую кеш: ложь потому что я чувствую, что это хорошо для этого случая. я использую dataType: ‘text’ потому что вы ожидаете только число — так почему бы и нет? Мне просто больше поцелуя. Возможно, это будет работать с ‘HTML’.

Кстати, может быть другое место, где может быть скрыта другая ошибка:
код / ​​rank.php? URL = google.com

Если ваш текущий URL
www.example.com/somefolder/
тогда это будет интерпретироваться как
www.example.com ** / SomeFolder / ** / Код rank.php? URL = google.com

Если ваш текущий URL-адрес www.example.com/somefolder/another/
тогда это будет интерпретироваться как
www.example.com ** / SomeFolder / другое / ** / Код rank.php? URL = google.com

Мой совет — вы всегда можете использовать Firefox или Google Chrome Developer Tools> Network, чтобы увидеть, что возвращает ваш ajax-запрос — «1» или «PAGE 404 NOT FOUND» ^ _ ^

Отвечая на комментарий:

Да, вы поняли суть этого правильно.
Вот один из способов, как вы могли бы это реализовать
(это было бы удобно для моего мышления и организации кода):

<html>
<head>
<script>
// defining tool:
function updateRankForSite( inUrl, $inInsertTo ) {
$.ajax({
url: 'code/rank.php?url=' + inUrl,
type: 'get',
dataType: 'text',
cache: false,
success: function(data)
{
alert(data);
$inInsertTo.html(data);
}
});
}
</script>
<script>

// using tool:
$(function(){
outputRankForSite( 'google.com', $('#rank-google') );
outputRankForSite( 'yandex.com', $('#rank-yandex') );

// and here is example how to interact with user
$('button-1').click( function( event ) {

// comment
// event.preventDefault() blocks default behavior
// for clicking on <a href="...">...</a> tag
// that means you wouldn'd be redirected to href
event.preventDefault();
outputRankForSite(
'stackoverflow.com',
$('#rank-stackoverflow')
);

// comment:
// and you can leverage not just 'stackoverflow.com'
// but anything that user wants - he can
// put his request to <input="text" id="example-input" ...>
// and you could collect his input by using command like
// $('#example-input').val()
});
});
</script>
</head>
<body>
<p>Alexa rank for google.com: <span id="rank-google"></span></p>
<p>Alexa rank for yandex.com: <span id="rank-yandex"></span></p>
<p>
Alexa rank for stackoverflow.com (press button to get rank):
<span id="rank-stackoverflow"></span>
</p>
<a href="#" id="button-1">Press this button to update rank</a>
</body>
</html>
2

Другие решения

Других решений пока нет …