Question

在我的html中，我有一个div id =＆＃34; mainWrapper＆＃34;我想插入我在外部js文件中创建的html标记。如何在不消除＆＃34; MainWrapper＆＃34 ;?内的任何现有div的情况下执行此操作？我希望外部标记是＆＃34; mainWrapper＆＃34;的孩子。下面是我的外部JS文件和HTML文件。

＆＃13;

//External mainScript.js file//
var pageContent = {

	skinImg: "images/staticTO_SKIN_000000.jpg",
	leaderBoardImg: "images/staticTO_LEADERBOARD.jpg"
}



function renderLB(){

	var markup ='\
		<div id="leaderBoard"><img src='+pageContent.leaderBoardImg+'> </div>\
		<style>\
		 #leaderBoard{width:1200px; height:82px; position:relative;top:0px}\
		 #pageContent{top: 65px;}\
		 </style>'

		renderMarkup(markup);

}

renderLB();


function renderMarkup(markup){

	
}

＆＃13;

<html>
<head>
	<title> </title>
	<style>

	body{
		padding: 0px;
		margin: 0px;
	}

	#mainWrapper{
		width: 1200px;
		margin: 0 auto;
		height: auto;
	}

	#pageContent{
		position: relative;
		width: 1200px;
		height: 953px;

	}

	</style>

</head>
<body id="body">

	<div id="mainWrapper">
		<div id="pageContent"><img src="images/pageSkin.jpg">  </div>
	<div>	
		<script src="mainScript.js">  </script>

</body>
</html>

＆＃13;

Answer 1

我不确定我明白你想要什么。但是如果要在节点中附加html而不丢失孩子，你可以这样做：

function renderMarkup(markup) {
  var main_wrapper = document.getElementById('mainWrapper');
  main_wrapper.innerHTML += markup;
}

Jquery为您提供了内置函数：

$('#mainWrapper').append(markup);

这是documentation

将外部HTML加载到DIV中

1 个答案: