Как поменять элемент H1 с H1 в другом документе, используя JQuery

Question

Как поменять элемент H1 с H1 в другом документе, используя JQuery

0

Пожалуйста, несите меня, потому что я студент. Мой инструктор заставил нас смотреть 5 видеороликов YouTube, и теперь мы планируем использовать JQuery вместо стандартного JavaScript. Все, что я хочу сделать, это обмен файлом с элементом из другого файла.

Вот мой HTML-код:

<!doctype html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Testing JQuery</title>
    <script src="jquery-1.7.2.min.js"></script>
  </head>
  <body>
    <h1 id="header">Testing JQuery</h1>
    <p id ="dummy">Lorem Ipsum </p>
    <script src="changes.js"></script>
    <form name="input" action="changes.js">
    <input type="button" value="Change the Header">
    </form>
  </body>
</html>

Вот мой код JavaScript/JQuery:

$(document).ready(function() {
  $('input').click(function() {
    var url = $(this).attr('form');
    $('#header').load( greeting.html + '#ajax h1');
    return false;
  });
});

Третий файл называется greeting.html, и это все, что он содержит:

<h1 id="ajax">Hello from jQuery with AJAX</h1>

Tony Smith 20 сен. 2013, в 00:07

Источник

Теги:

javascript

jquery

html

2 ответа

1

Чтобы заменить элемент, load() не будет работать, поскольку он загружает новый H1 внутри старого H1, он его не заменяет, поэтому вам нужно использовать $.get и сделать это самостоятельно:

$(document).ready(function() {
    $('input').on('click', function() {
        $.get({
             url : 'greeting.html'
        }).done(function(data) {
             var h1 = $('<div />').append(data).find('h1#ajax');
             $('#header').replaceWith(h1);
        });
       return false;
    });
});

adeneo 19 сен. 2013, в 19:08

Ещё вопросы

Andreas Klein · Accepted Answer · 2013-09-19T20-32-00.000Z

$('#header').load( 'greeting.html #ajax' );

Это все, что вам нужно. Избавьтесь от всего остального. Вам не нужно объявлять url и вам не нужно возвращать false.

он хочет сделать это, щелкнув по входу при вызове сценария, если вы заметили объявление действия в элементе формы
Спасибо Андреас! Это сработало отлично! Я знал, что это была синтаксическая ошибка с моей стороны, но я не мог ее найти!