用另一个元素/文本替换 html 元素。 源代码中的问题

Question

我从很多天开始工作（我不是开发人员）。 我想用另一个元素/文本（page-id-27 中的 p 到 h1）替换 HTML 元素，尝试了 3 种不同的解决方案，并且在检查模式和“视觉”下工作，但源代码没有改变。 我真的需要源代码也可以改变。 这个想法可能吗？ 这里有什么问题吗？ 非常感谢

HTML：

<p class="title_banner"><strong>Sport</strong></p>

3 解决方案：

$.noConflict();
jQuery(document).ready(function($){
var str = '<h1>Sport</h1>';
$('.title_banner').replaceWith(str);
    });

var e = document.getElementsByClassName('title_banner')[0];
var d = document.createElement('h1');
d.innerHTML = e.innerHTML;
e.parentNode.insertBefore(d, e);
e.parentNode.removeChild(e);

$.noConflict();
jQuery(document).ready(function($){
$(document).ready(function(){
$(".title_banner").html("<h1>Sport</h1>");
});
});

Function

function scriptnew(){
wp_register_script('dynamic-title', get_stylesheet_directory_uri() . '/js/dynamic-title.js', array( 'jquery' ), NULL, false );
if ( is_page('27') ) {
wp_enqueue_script( 'dynamic-title' );
}}
add_action( 'wp_enqueue_scripts', 'scriptnew', 10 );

Answer 1

尝试替换元素

首先从元素p获取 innerHtml 。

然后创建一个新元素h1将内容放在新元素中。

在此之后将元素p替换为h1

 var x = document.getElementsByClassName('title_banner')[0]; var y = x.innerHTML; var newItem = document.createElement('h1'); newItem.innerHTML = y; x.parentNode.replaceChild(newItem, x);

 <p class="title_banner"><strong>Sport</strong></p>