innerHTML,outerHTML,innerText,outerText的用法及区别解析_javascript技巧

<p><div id="div" style="background-color:#ff9966;border:1px #ff0000 dashed;"><span>这是一个层</span></div>
<input name="innerHTML" value="innerHTML" type="button" OnClick="alert(div.innerHTML);">
<input name="outerHTML" value="outerHTML" type="button" OnClick="alert(div.outerHTML);">
<input name="innerText" value="innerText" type="button" OnClick="alert(div.innerText);">
<input name="outerText" value="outerText" type="button" OnClick="alert(div.outerText);">
<script language="javascript">
function changeb(obj)
{
 obj.outerHTML = "<input type='text' value='设置对象内的HTML,包括标签' style='width:200px;'></input>"
}
function changea(obj)
{
 obj.innerHTML = "<b>设置对象内的HTML</b>"
}
</script>
<br><br>
innerHTML获取标签内的HTML<br>
outerHTML获取标签及标签内的HTML<br>
innerTEXT和outerTEXT都是获取标签内的文本,相同。<br>
<br><br>
<div id="div1" style="background-color:#ff9966;border:1px #ff0000 dashed;">这是一个层</div>
<br>
<input name="innerHTML1" value="innerHTML" type="button" OnClick="changea(div1)">
<input name="outerHTML1" value="outerHTML" type="button" OnClick="changeb(div1)">
<input name="innerText1" value="innerText" type="button" OnClick="div1.innerText='使用innerText替换文本'">
<input name="outerText1" value="outerText" type="button" OnClick="div1.outerText='使用outerText会连带标签一起替换成目标文本,层也替换掉了'">
<br>
<p>
innerHTML设置标签内的HTML<br>
outerHTML设置标签及标签内的HTML<br>
innerTEXT设置签内的文本<br>
innerTEXT设置签内的文本,包括标签一起替换。<br>
</p>

innerHTML 设置或获取位于对象起始和结束标签内的 HTML <br>
outerHTML 设置或获取对象及其内容的 HTML 形式 <br>
innerText 设置或获取位于对象起始和结束标签内的文本 <br>
outerText 设置(包括标签)或获取(不包括标签)对象的文本 <br><br>

时间: 2024-09-12 06:10:38

innerHTML,outerHTML,innerText,outerText的用法及区别解析_javascript技巧的相关文章

innerHTML,outerHTML,innerText,outerText

innerHTML,outerHTML innerHTML检索或设置标签内的内容: outerHTML检索或设置整个标签的内容(包含标签). <fieldset id="fieldset" style="width:600;height:40"> <SPAN ID="oSpan">Original Text</SPAN> <input type="button" onclick=&qu

变量声明时命名与变量作为对象属性时命名的区别解析_javascript技巧

这个标题实在拗口,Javascript命名变量所遵循的规则 1.第一个字符必须是字母.汉字字符. 下划线(_)或美元符号($) 2.剩下的可以是下划线.汉字字符. 美元符号和任何字母.数字 以下声明变量是正确的 复制代码 代码如下: var p,$p,_p; var 长,宽;  以下是错误的 复制代码 代码如下: var .p;//只能是字母.数字.下划线或美元符号 var -p;//只能是字母.数字.下划线或美元符号 var p*;//只能是字母.数字.下划线或美元符号 var 4p,4长;/

JavaScript中Null与Undefined的区别解析_javascript技巧

在JavaScript中存在这样两种原始类型:Null与Undefined.这两种类型常常会使JavaScript的开发人员产生疑惑,在什么时候是Null,什么时候又是Undefined? Undefined类型只有一个值,即undefined.当声明的变量还未被初始化时,变量的默认值为undefined. Null类型也只有一个值,即null.null用来表示尚未存在的对象,常用来表示函数企图返回一个不存在的对象. 复制代码 代码如下: var oValue;  alert(oValue ==

php中静态类与静态变量用法的区别分析_php技巧

本文实例分析了php中静态类与静态变量用法的区别.分享给大家供大家参考.具体分析如下: static是定义一个静态对象或静态变量,关于static 定义的变量或类方法有什么特性我们看完本文章的相关实例后就见分晓了. 1. 创建对象$object = new Class(),然后使用"->"调用:$object->attribute/function,前提是该变量/方法可访问. 2. 直接调用类方法/变量:class::attribute/function,无论是静态/非静态

JavaScript中apply与call的用法意义及区别说明_javascript技巧

apply和call,它们的作用都是将函数绑定到另外一个对象上去运行,两者仅在定义参数的方式有所区别: Function.prototype.apply(thisArg,argArray); Function.prototype.call(thisArg[,arg1[,arg2-]]); 从函数原型可以看到,第一个参数都被取名为thisArg,即所有函数内部的this指针都会被赋值为thisArg,这就实现了将函数作为另外一个对象的方法运行的目的.两个方法除了thisArg参数,都是为Funct

jQuery中bind,live,delegate与one方法的用法及区别解析_jquery

bind( )方法用于将一个处理程序附加到每个匹配元素的事件上并返回jQuery对象. .bind(eventType[, evnetData], Handler(eventObject)) 其中,参数eventType是一个字符串,包含一个或多个javaScript事件类型,例如click,submit或自定义事件的名称,指定多个事件类型时用空格分隔各个类型:eventData为Map类型,给出要传递给事件处理程序的数据,handler指定触发该事件时要执行的函数,eventObject表示事

javascript css在IE和Firefox中区别分析_javascript技巧

一.document.formName.item("itemName") 问题  问题说明:IE下,可以使用 document.formName.item("itemName") 或 document.formName.elements ["elementName"]:Firefox下,只能使用document.formName.elements["elementName"]. 解决方法:统一使用document.formNa

createElement与createDocumentFragment的点点区别小结_javascript技巧

网上可以搜到的大部分都是说使用createDocumentFragment主要是因为避免因createElement多次添加到document.body引起的效率问题,比如: 复制代码 代码如下: var arrText=["1","2","3","4","5","6","7","8","9","10"];

Js+Ajax,Get和Post在使用上的区别小结_javascript技巧

get和post方法最大的不同在于: 1.get方法传值参数在url里面,而post参数放send里面 2.post方法必须加上 xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); 下面实例可以看get方法 xmlHttp.open("GET","for.php?text="+url,true); 在post里面表现为: