Heim > Artikel > Web-Frontend > javascript中innerText和innerHTML属性用法实例分析_javascript技巧
javascript中innerText和innerHTML属性用法实例分析_javascript技巧
- WBOYOriginal
- 2016-05-16 15:59:231110Durchsuche
本文实例讲述了javascript中innerText和innerHTML属性用法。分享给大家供大家参考。具体分析如下：
几乎所有DOM元素都有innerText,innertHTML属性(注意大小写),分别是元素标签内
的文本表示形式和HTML源代码，这两个属性是可读可写的
innerHTML也可以取代createElement,属于简单，粗放型，后果自负的创建
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>测试(innerText和innerHTML)</title>
<script type="text/javascript">
function TestOutput() {
var myLink = document.getElementById("lnk");
alert('innerText-->' + myLink.innerText);
//得到百度网站
alert('innerHTML-->' + myLink.innerHTML);
//得到百<font color="red">度</font>网站
}
function EditInnerText() {
var myLink = document.getElementById("lnk");
myLink.innerText = "凤凰网";
}
function EditInnerHTML() {
var myLink = document.getElementById("lnk");
myLink.innerHTML = "<font color='blue'>凤凰网</font>";
}
function dynamicButtonClick() {
alert('我是动态创建的');
}
function CreateButton() {
var div = document.getElementById("divMain");
div.innerHTML = "<input type='button' value='单击我'
onclick='dynamicButtonClick()' />";
}
</script>
</head>
<body>
<a href="http://www.baidu.com" id="lnk">
百<font color="red">度</font>网站</a>
<input type ="button" value="测试" onclick="TestOutput()"/>
<input type="button"" value="修改InnerText" onclick="EditInnerText()"/>
<input type="button"" value="修改InnerHTML" onclick="EditInnerHTML()"/>
<div id="divMain"></div>
<input type="button" value="动态添加按钮" onclick="CreateButton()"/>
</body>
</html>
希望本文所述对大家的javascript程序设计有所帮助。
Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：javascript鼠标滑动评分控件完整实例_javascript技巧Nächster Artikel：浅谈javascript中的闭包_javascript技巧