javascript 中的innerHTML的用法

javascript中innerHtml用法

2009-04-21 22:52

function Test(){
       var str="";
       str+="Hello,";
       str+="This is a Test!<br />";
       str+="I Love you;<br />";
       str+="I Love you,too!";
       p.innerHTML=str+"<br /><br />"+Math.random();
       setTimeout('Test();',1000);
}
</script>
</head>
<body οnlοad=Test()>
<span id="p"></span>
</body>
</html>

innerTEXT与innerHTML的区别：

innerHTML自带了语法检查功能,他会自动把不完整的HTML代码补充完整.运行如下的一个测试代码就可以发现了.

document.getElementById("AlbumList").innerHTML="<table><tr>";
alert(document.getElementById("AlbumList").innerHTML);

他会自动把我的代码里面添加了<tbody>和</tr></table>等标记.神奇!!!

所以在网页中,我们经常这样用;

document.getElementById("content").innerHTML=" 需显示的内容 "

</script>

这样就会在id 是content的标记那里显示"需显示的内容";

这个可以用在显示一篇文章的摘要的部分,防止将带有HTML标记的文章中的代码截掉标记的结束部分,

e,g:

str="<a href=#/>沙漠中的绿洲</a><img src=p_w_picpath.jpg>"

left(str,60)则是"<a href=#/>沙漠中的绿洲</a><img src=p_w_picpath"

document.getElementById("content").innerHTML="left(str,60) "

</script>

innerHTML，是在块中加html代码；innerText 在块中加文字。 (注意大小写)

innerText 属性在 IE 浏览器中可以得到当前元素过滤掉 HTML Tags 之后的文本内容，在某些时候还是比较有用。但类似的非标准属性/方法在其他浏览器中并不一定都得到支持。

例子:<html>
<head>
<title>DHtml举例13</title>
<style>
</style>
<script language="JavaScript">
function OutputText()
{
if(frm.txt.text!="")
{ Output.innerHTML="在此处输出文本：<u>"+frm.txt.value+"</u>";} //Output为一对象。
else
{ Output.innerText="在此处输出文本：";}
}//function

</script>
</head>

<form name="frm">
<p><font color="gray">请在文本框中输入文字:</font>
<input type="text" name="txt" size="50"><br>
<input type="button" value="输出文本" name="B1" class="blue" οnclick="OutputText()"></p>
</form>

<p id="Output">在此处输出文本：</p>
</body>
</html>

转载于:https://blog.51cto.com/xiaozhuzhu/154375

javascript 中的innerHTML的用法相关推荐

详解 javascript中offsetleft属性的用法（转）
详解 javascript中offsetleft属性的用法转载 2015-11-11 投稿:mrr 我要评论本章节通过代码实例介绍一下offsetleft属性的用法,需要的朋友可以做一 ...
javaScript 中 call 函数的用法说明
javaScript 中 call 函数的用法说明 javaScript 中的 call() 是一个奇妙的方法,但也是一个让人迷惑的方法,先看一下官方的解释: call 方法请参阅应用于:Func ...
html中的js作用,javascript中的innerHTML属性有什么作用
innerHTML在javaScript中具有双向功能,一是可以从指定的元素对象中获取内容,二是可以把自定义内容插入到指定的元素对象中去. 定义和用法 innerHTML属性用于设置或返回指定标签之间 ...
JavaScript中的innerHTML，innerHTML，value属性
一,innerHTML innerHTML在javaScript中具有双向功能,一是可以从指定的元素对象中获取内容,二是可以把自定义内容插入到指定的元素对象中去. 定义和用法: innerHTML属性 ...
JavaScript中onload和unload用法
window.onload: 页面加载完成后执行一,window.onload的用法: 因为页面中的代码一般情况下按照,从上到下,从左到右的顺序执行. 所以当js代码需要获取页面中的元素时,如果 ...
JavaScript中的innerHTML使用
innerHTML innerHTML属性允许更改html元素的内容,可以设置或返回表格行的开始和结束标签之间的HTML,本篇文章就来给大家介绍关于innerHTML的用法 innerHTML的写法 ...
JavaScript中innerText,innerHTML,outerText,outerHTML使用心得和区别
<div id = "test"> <span style="color:red">test1</span> ...
javascript中window.event事件用法详解
前两天写程序时因为要用到javascript中的window.event事件,于是就在网上搜了一下,终于找到一篇不错的文章,来与大家分享下: 描述 event代表事件的状态,例如触发event对 ...
javaScript中的instanceOf的用法
在javaScript中,判断一个变量的类型往往会使用typeof运算符,再使用typeof运算符是采用引用类型存储值会'出现一个问题,无论引用的是什么类型的对象,他都返回'object'.这就需要 ...

javascript 中的innerHTML的用法

javascript 中的innerHTML的用法相关推荐

最新文章

热门文章