JavaScript中的innerHTML，innerHTML，value属性

一，innerHTML

innerHTML在javaScript中具有双向功能，一是可以从指定的元素对象中获取内容，二是可以把自定义内容插入到指定的元素对象中去。

定义和用法:
innerHTML属性用于设置或返回指定标签之间的HTML内容

Object.innerHTML = "HTML";// 设置
var html = Object.innerHTML;// 获取

例1：
获取ID为mochu的P标签元素中的内容

<html>  <head>  <script type="text/javascript">  function getinnerHTML(){  alert(document.getElementById("mochu").innerHTML);  }  </script>  </head><body>  <p id="mochu"><font color="#000">获取到的内容！</font></p>  <input type="button" onclick="getinnerHTML()" value="点击" />  </body>
</html>

例2：
向ID为mochu的P标签元素中插入内容

<html>  <head>  <script type="text/javascript">  function setInnerHTML(){  document.getElementById("mochu").innerHTML = "<span>这里是替换的内容包括标签</span>";  }  </script>  </head><body>  <p id="mochu"><font color="#000">被替换掉的内容</font></p>  <input type="button" onclick="setInnerHTML()" value="点击" />  </body>
</html>

二，innerHTML

定义和用法:
innerText属性设置或返回指定节点及其所有后代的文本内容 .

node.innerText  //返回
node.innerText = text  //设置

例：
获取元素的内部文本：

var x = document.getElementById("myBtn").innerText;

innerHTML和innerText的区别：

InnerHTML返回标记内的HTML内容，其中包含HTML标记。
InnerText返回标记内文本的值，而不是HTML标记的值。

三，value

value 属性可设置文本域的默认值。

例：
获得文本域的默认值：

<html><head><script type="text/javascript">function alertValue(){alert(document.getElementById("text1").value)}</script></head><body><form><input type="textfield" id="text1" value="1" /><input type="button" id="button1" onclick="alertValue()" value="click" /></form></body>
</html>

本文首发于前端黑洞网，csdn同步跟新

JavaScript中的innerHTML，innerHTML，value属性相关推荐

JavaScript中四种不同的属性检测方式比较
JavaScript中四种不同的属性检测方式比较 1. 用in方法 var o = {x:1}; "x" in o; //true "y" in o; //fa ...
使用JavaScript中的示例编号MAX_VALUE属性
数字MAX_VALUE属性 (Number MAX_VALUE Property) MAX_VALUE Property is a Number property in JavaScript and ...
js获取html元素并且修改属性,JavaScript中获取和修改元素属性的值
在上一篇关于<JavaScript中几个操作元素对象的函数方法>文章中记录了分别通过元素的ID属性,元素的标签名,Class类名来获取元素的节点对象. 今天记录两个函数可以用来获取和修改获 ...
JavaScript中函数里的arguments属性
<!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...
javascript 中的各种width,height属性整理
目标: 理清js及jquery的各种width和height 对象: Window对象表示浏览器中打开的窗口:window对象可以省略.比如alert().window.alert(). Docume ...
JavaScript中闭包实现的私有属性的getter()和setter()方法
注意: 以下的输出都在浏览器的控制台中 <!DOCTYPE html> <html> <head><meta charset="utf-8" ...
javascript中节点操作、节点属性、节点获取、创建节点、删除节点、克隆节点
节点操作节点操作实际是利用DOM树把节点划分为不同的层次关系,常见父子兄弟级关系节点属性: 节点一般有三个属性:nodeType节点类型(其中元素节点值为1,属性节点值为2,文本节点值为3).no ...
JavaScript中判断是否存在某属性
Js中的属性分为两种,一种是固有属性,另外是编程时赋预予的属性,这两种属性的判断方式是不一样的. 1.使用in关键字. 该方法可以判断对象的自有属性和继承来的属性是否存在. var o={x:1}; ...
html代码name是什么意思,JavaScript中nodeName是什么意思？
nodeName是JavaScript中的一个HTML DOM属性,nodeName属性可以返回指定节点的名称.下面本篇文章就来给大家介绍一下JavaScript的nodeName属性,希望对大家有所 ...
javascript中实例方法与类方法的区别
在javascript中,类有静态属性和实例属性之分,也有静态方法和实例方法之分类属性(静态属性):通过类直接访问,不需要声明类的实例来访问类方法(静态方法):通过类直接访问,不需要声明类的实例来 ...

JavaScript中的innerHTML，innerHTML，value属性

本文首发于前端黑洞网，csdn同步跟新

JavaScript中的innerHTML，innerHTML，value属性相关推荐

最新文章

热门文章