在jQuery Mobile中动态添加标头标签

Question

我有一个HTML页面，其中包含页眉，内容和页脚div。

<div data-role="page" id="Homelist" >
    <div data-role="header" >
        <h1>heading</h1>
        <a href=""/></a>
    </div>
    <div data-role="content">
          <img>
    </div>
    <div data-role="footer" >
           <h3>show</h3>
    </div> 
</div>

在h1标记下方，我必须在JavaScript文件中添加h3和h4标记。

我在JavaScript文件中会有一个值“var header2 = "mini-header";"。我可以在HTML文件中使用header2值。

Answer 1

您可以使用jquery将任何元素的内容更改为您想要的内容：

HTML：

注意：ID

 <div data-role="header" id="header">
      <h1>heading</h1>
      <a href=""/></a>  
 </div>

改变内容的Javascript：

$("#header").html("<h1>heading</h1><h2>heading2</h2><h3>heading3</h3><a href=''/</a>");

其中＃是id选择器。通过jQuery文档。

使用javascript变量的值：

var myheader="header3";
$("#header").html("<h1>heading</h1><h2>heading2</h2><h3>"+myheader+"</h3><a href=''/</a>");