js中向对象中添加属性的两种方法？

JavaScript012

js中向对象中添加属性的两种方法？,第1张

1.1 数据属性（`properties`），对象的普通属性将字符串名称映射到值。例如，下面对象obj有一个数据属性，名称为 prop，对应的值为 123：var obj = {prop: 123}可以用以下方式读取属性的值：console.log(obj.prop)// 123，console.log(obj["prop"])// 123，当然也可以用以下方式来设置属性的值：obj.prop = "abc"obj["prop"] = "abc"

1.2 访问器属性，另外，可以通过函数处理获取和设置属性值。 这些函数称为访问器函数。 处理获取的函数称为getter。 处理设置的函数称为setter：var obj = {get prop () {return 'Getter'},set prop (value) {console.log('Setter: ' + value)}}访问 obj 属性：>obj.prop'Getter'>obj.prop = 123Setter: 123。

1.3 内部属性一些属性只是用于规范，这些属于“内部”的属性,因为它们不能直接访问,但是它们确实影响对象的行为。内部属性有特殊的名称都写在两个方括号，如：内部属性[[Prototype]]指向对象的原型。它可以通过Object.getPrototypeOf()读取。它的值只能通过创建具有给定原型的新对象来设置，例如通过object.create()或__proto__ 。

内部属性[[Extensible]]决定是否可以向对象添加属性。可以通过Object.isExtensible() 方法判断一个对象是否是可扩展的（是否可以在它上面添加新的属性）。可以通过Object.preventExtensions()方法让一个对象变的不可扩展，也就是永远不能再添加新的属性。

属性特性(attribute)，属性的所有状态，包括数据和元数据，都存储在特性(attribute)中。它们是属性具有的字段，就像对象具有属性一样。特性(attribute)键通常用双括号编写：

当我们在写jsp页面时，往往会遇到这种情况：从后台获取的数据个数不确定，此时在前端写jsp页面时也就不确定怎么设计了。这个时候就需要通过js动态创建标签：

1.创建某个标签：如下在body中创建一个div的事例；

<script>

function

fun(){

var

frameDiv

=

document.createElement("div")//创建一个标签

var

bodyFa

=

document.getElementById("bodyid")//通过id号获取frameDiv

的父类（也就是上一级的节点）

bodyFa

.appendChild(frameDiv)//把创建的节点frameDiv

添加到父类body

中；

}

<script>

<body

id="bodyid"

>

<!--在此添加div标签-->

</body>

2.添加属性：给创建的标签添加相应的属性：

frameDiv

.setAttribute("id",

"divid")//给创建的div设置id值；

frameDiv

.className="divclass"

//给创建的div设置class；

//给某个标签添加显示的值；

var

h

=

document.createElement("h1")

h.innerHTML

=

data[i].name

var

p

=

document.createElement("p")

p.innerHTML

=

"要显示的值"

3.创建的标签添加事件：

a.不带参数：

frameDiv.onmousedown

=

fun//ps：函数名fun后面一定不能带括号，否则会在创建标签的时候执行函数，

而不是鼠标按下时执行；

b.有参数：

frameDiv.onmousedown

=

function(){

fun(this)

}

c.要调用的函数；

function

fun(){

alert("鼠标按下")

}

4.如果担心创建的标签没有被覆盖则可以替换：

var

divFlag

=

document.getElementById("divFlag")

var

divMain

=

document.createElement("div")

if(divFlag

!=

null){

body.replaceChild(divMain,

divFlag)//把原来的替换掉

}

divMain.setAttribute("id",

"divFlag")

以上这篇通过js动态创建标签,并设置属性方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。

您可能感兴趣的文章:JS实现给对象动态添加属性的方法JS中动态创建元素的三种方法总结(推荐)js动态创建标签示例代码使用变量动态设置js的属性名