jQuery代替iframe，实现点击li就加载相应html到div
想用jQuery代替iframe，实现点击li就加载相应html到div，求完整代码。<!doctypehtml><html><head><metacharset="ut...
想用jQuery代替iframe，实现点击li就加载相应html到div，求完整代码。
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<script type="text/javascript" src="../OneDrive/WWW/wos/js/jquery-3.4.1.min.js"></script>
</head>
<body>
<ul>
<li>加载根目录a.html</li>
<li>加载根目录b.html</li>
</ul>
<div id="test1"></div>
</body>
</html> 展开
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<script type="text/javascript" src="../OneDrive/WWW/wos/js/jquery-3.4.1.min.js"></script>
</head>
<body>
<ul>
<li>加载根目录a.html</li>
<li>加载根目录b.html</li>
</ul>
<div id="test1"></div>
</body>
</html> 展开
1个回答
展开全部
可以实现，但它的效果与你想象中肯定会不一样，iframe是框架，加载的页面是以完整的、独立的、新的网页形式出现的，与当前网页没有直接关系；而如果把网页内容直接放到当前网页的div中，就会成为当前网页的一部分，与当前网页的html、css、js等都会产生冲突的。下面是代码：
<body>
<ul>
<li data-url="a.html">加载根目录a.html</li>
<li data-url="b.html">加载根目录b.html</li>
</ul>
<div id="test1"></div>
<script>
$(function(){
$("ul li").on("click",function(){
$("#test1").load($(this).data("url"));
});
});
</script>
</body>
<body>
<ul>
<li data-url="a.html">加载根目录a.html</li>
<li data-url="b.html">加载根目录b.html</li>
</ul>
<div id="test1"></div>
<script>
$(function(){
$("ul li").on("click",function(){
$("#test1").load($(this).data("url"));
});
});
</script>
</body>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
