对于innerHTML 属性,几乎所有的元素都有innerHTML属性,它是一个字符串,用来设置或获取位于对象起始和结束标签内的HTML。(获取HTML当前标签的起始和结束里面的内容)
对于innerText属性: 从起始位置到终止位置的内容, 但它去除Html标签 (只在IE里面有)
注意:innerHTML 属性只在js里面有,在Jquery里面是没有的,如果要使用则用$("#t").html("sdsds"); or $("#t")[0].innerHTML="sdsds";
innerHTML是符合W3C标准的属性,而innerText只适用于IE浏览器,因此,尽可能地去使用innerHTML,而少用innerText
jQuery封装的方法html,text,val
.html()用为读取和修改元素的HTML标签
.text()用来读取或修改元素的纯文本内容
.val()用来读取或修改表单元素的value值。
<html>
<head>
<script src="/jquery/jquery-1.11.1.min.js"></script>
<script>
$(document).ready(function(){
$("#btn1").click(function(){
alert( $("#test").text()); 结果:这是段落中的粗体文本
});
$("#btn2").click(function(){
alert( $("#test").html()); 结果:这是段落中的<b>粗体</b>文本
});
});
</script>
</head>
<body>
<p id="test">这是段落中的<b>粗体</b>文本。</p>
<button id="btn1">显示文本</button>
<button id="btn2">显示 HTML</button>
</body>
</html>
setInterval与setTimeout的区别
在制作网页动态效果时,一定会遇到某些需求,要求某段程序等待多时时间后再开始执行,就像在我们的生活中一样,待会儿再开始做一件事。在JavaScript中主要通过定时器实现此类需求,本文将对定时器做一个概括,正对setTimeout()做一个详细用法总结。
一.setInterval与setTimeout的区别
setInterval
setInterval()方法可按照指定的周期来调用函数或者计算表达式(以毫秒为单位)
语法:
setInterval(函数表达式,毫秒数);
setInterval()会不停的调用函数,直到clearInterval()被调用或者窗口被关闭,由 setInterval()返回的ID值可用作clearInterval()方法的参数。
setTimeout
setTimeout()方法用于在指定毫秒数后再调用函数或者计算表达式(以毫秒为单位)
语法:
setTimeout(函数表达式,毫秒数);
setTimeout()只执行函数一次,如果需要多次调用可以使用setInterval(),或者在函数体内再次调用setTimeout()
区别
通过以上分析可以看出,setTimeout与setInterval的主要区别是:
setTimeout()方法只运行一次,也就是说当达到设定的时间后就出发运行指定的代码,运行完后就结束了,如果还想再次执行同样的函数,可以在函数体内再次调用setTimeout(),可以达到循环调用的效果。
setInterval()是循环执行的,即每达到指定的时间间隔就执行相应的函数或者表达式,是真正的定时器。
二.setTimeout()的用法
先写个最简单的demo,如下:
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="utf-8"> 5 <script> 6 setTimeout("alert(‘hello‘)",2000); 7 </script> 8 </head> 9 <body> 10 </body> 11 </html>
页面会在停留2秒之后弹出对话框,注意setTimeout不会自动重复执行!
当然,setTimeout也可以执行function,还可以不断重复执行!
你可以看到h1中的文本数字在一秒一秒地递增!
更加灵活的是,你还可以指定重复执行的次数,如下:
if判断中的数字,是用来限制重复执行次数的条件。
三.clearTimeout()
要使用clearTimeout(),需要我们设定setTimeout()时, 给予这setTimeout()一个名称, 这名称就是timeoutID ,我们叫停时,就是用这 timeoutID 来叫停
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="utf-8"> 5 <script> 6 var timeId= setTimeout("alert(‘hello‘)",2000); 7 clearTimeout(timeId); 8 </script> 9 </head> 10 <body> 11 </body> 12 </html>
原计划1秒后弹出的警示框,被自然叫停了。