怎么在Div标签中嵌入另一个HTML

html-css08

怎么在Div标签中嵌入另一个HTML,第1张

解答:

1,基于Jquery的DIV嵌套html

html代码:

<script src="js/jquery.js"></script> <div id="btn" > 新页面</div>

<div id="newDiv"></div>

js代码:

$(document).ready(function)(){

    $("#btn").click(function(){

    $('#newDiv').load('new.html')

  })

})

点击“新页面”即可实现添加

2,基于纯js代码实现嵌套:

html代码:

<button type="button" id="btn" onClick="javascript:load_home()" >

 确认</button>1

js代码:

function load_home() {

 document.getElementById("viewDiv").innerHTML = '<object 

type="text/html" data="new.html" width="100%" height="100%">

</object>'

   }

大的DIV中嵌套两个小的DIV一左一右步骤如下:

1,首先,图中显示的Web结构是html和css。

2,打开html页面,如图所示,定义一个大div和两个小div。

3,最常用的float float,只要两个小div的宽度小于或等于大div的宽度,就可以并排实现。

4,使用position进行绝对定位,然后使用margin-left删除第一个小div的宽度。

5,使用表格框并排实现div,这是相同的宽度。

6,如图所示,这是上面三种方法运行后的结果,可以看到两个大DIV嵌套在一个大DIV中。

1、打开编辑器,新建test.html,用于学习今天的内容。如下图所示:

2、接下来需要在head标签下方引入jquery.min.js插件,如下图所示:

3、在页面的body标签里,新建一个div,名称为test。如下图所示:

4、在body标签下方写上<script></script>,用来存放js代码。通过class定位到div,通过css()方法让文字居中。如下图所示:

5、在浏览器中打开test.html,可以在文字在页面中间显示。如下图所示: