求助如何使用js向div追加html代码
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了求助如何使用js向div追加html代码相关的知识，希望对你有一定的参考价值。
//这是直接插入htmldocument.getElementById("div_id").innerHTML = "你想往div里插入的html代码";
//如果想追加，可以这样
//先保存div中原来的html
var html = document.getElementById("div_id").innerHTML;
//再跟你想追加的代码加到一起插入div中
document.getElementById("div_id").innerHTML = html + "你想往div里追加的html代码"; 参考技术A
<!DOCTYPE html>
<html>
<head>
<script src="jquery.js"></script>
<div id="dictionary">
</div>
<div class="letters">
<div class="letter" id="letter-a">
<h3><a href="entries-a.html">A</a></h3>
</div>
<div class="letter" id="letter-b">
<h3><a href="entries-a.html">B</a></h3>
</div>
<div class="letter" id="letter-c">
<h3><a href="entries-a.html">C</a></h3>
</div>
<div class="letter" id="letter-d">
<h3><a href="entries-a.html">D</a></h3>
</div>
<!-- and so on -->
</div>
</head>
<body >
<script>
$(document).ready(function()
$('#letter-c a').click(function(event)
event.preventDefault();
$.getScript('c.js');
);
);
</script>
</body>
</html>
将写好的c.js文件放置同一个目录下面
var entries = [
"term": "CALAMITY",
"part": "n.",
"definition": "A more than commonly plain and..."
,
"term": "CANNIBAL",
"part": "n.",
"definition": "A gastronome of the old school who..."
,
"term": "CHILDHOOD",
"part": "n.",
"definition": "The period of human life intermediate..."
//省略的内容
];
var html = '';
$.each(entries, function()
html += '<div class="entry">';
html += '<h3 class="term">' + this.term + '</h3>';
html += '<div class="part">' + this.part + '</div>';
html += '<div class="definition">' + this.definition + '</div>';
html += '</div>';
);
$('#dictionary').html(html);
//$('#dictionary').append(html);
这里的$('#dictionary').html(html);可以直接将需要的代码放入到指定的div内 (<div id="dictionary">)
也可以通过$('#dictionary').append(html);将代码附加到指定的div内 (<div id="dictionary">)
用js实现点击按钮 显示div 然后两秒后消失 但是只能执行一次 怎么才能做到可以重复调用 求助
用js实现点击按钮 显示div 然后两秒后消失 但是只能执行一次 怎么才能做到可以重复调用 求助设置settimeout让他消失 但是只能用一次
<!DOCTYPE html><html>
<head>
<meta charset="utf-8">
<title></title>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
</head>
<body>
<div id="aaa" style="display: none;">
这是隐藏内容
</div>
<button id="but">点击显示</button>
<script type="text/javascript">
$('#but').click(function()
$("#aaa").css('display','block');
setTimeout(function()
$("#aaa").css('display','none');
,2000);
)
</script>
</body>
</html> 参考技术A 如果你用jQuery可以很容易的实现重复的效果。
JS的话，你可以设置一个变量例如x。
初始值是x=0，每当鼠标点击按钮一次，x就加1，然后判断，当x为奇数时，div隐藏，当x为偶数时x显示。
以上是关于求助如何使用js向div追加html代码的主要内容，如果未能解决你的问题，请参考以下文章