Есть ли способ обернуть тег <span>тегом <h1> с помощью встроенного JavaScript - PullRequest
Новая
       15

Есть ли способ обернуть тег <span>тегом <h1> с помощью встроенного JavaScript

0 голосов
/ 26 марта 2019

У меня есть страница HTML.RenderPartial, которая используется на нескольких страницах. На большинстве страниц он используется, мне не нужно оборачивать его в тег <h1>, но на одной странице мне нужно обернуть его в тег <h1>. Вот тег span, который мне нужно обернуть в тег <h1>: 

<span class="author-card--title" data-scroll-up-target>About the Author</span>

Поэтому я поместил этот код на страницу, которая мне нужна, чтобы изменить тег <span> на тег <h1>: 

<script type="text/javascript">
$(document).ready(function() {
    $('#author-card--title').contents().unwrap().wrap('<h1></h1>');
});
</script>

Я сохранил, скомпилировал и перезапустил страницу. Я вижу скрипт на странице, но он не меняет тег <span> на <h1>. Этот скрипт на этой странице: 

@if (Model != null && Model.Count > 0)
{
    <div class="author-landing">
        @if (Model.First().Author != null)
        {
            Html.RenderPartial("~/Views/Articles/Unit/_AuthorCard.cshtml", Model.First().Author);
        }
        @{
            Html.RenderPartial("~/Views/Articles/Unit/_AuthorArticleList.cshtml", Model);
        }
    </div>

    <script type="text/javascript">
        $(document).ready(function() {
            $('#author-card--title').contents().unwrap().wrap('<h1></h1>');
        });
    </script>
}
else
{
    <div class="author-landing">
        <h2> Author - <b style="color: green"> Name </b> doesn&#39;t have any article(s) published yet!</h2>                
    </div>
}

Я также переместил скрипт в оператор if, и до сих пор не могу заставить это работать.

Edit: Я изменил код на это: 

 <script type="text/javascript">
    $("span.author-card--title").wrap("<h1></h1>")
</script>

Все еще не повезло.

Редактировать 2: Добавил этот код и все заработало: 

<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>
<script type="text/javascript">
    $('.author-card--title').wrap('<h1></h1');
</script>

Я предположил (глупо, я), что страница загрузки уже ссылалась на jquery, а это не так. После того, как я установил источник, внёс незначительные коррективы в скрипт, он заработал.

Спасибо.

1 Ответ

0 голосов
/ 26 марта 2019

В соответствии с правкой 2 выше в коде, я не ссылался на источник jquery. После добавления это сработало. 

<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>
<script type="text/javascript">
    $('.author-card--title').wrap('<h1></h1');
</script>

Спасибо.

...