动态设置js的属性

目标:js的属性名可以使用变量

举例:js对象object,当赋给该对象属性的时候可以采用以下方式

var object;
object.prop1 = "value1";
object.prop2 = "value2";

也可以采用如下方式:

object.push({prop1:"value1"});
object.push({prop2:"value2"});

在这里prop1 作为属性名称,可以直接用,也可以加上引号,比如:

object.push({"<span style="font-family: Arial, Helvetica, sans-serif;">prop1</span>":"value1"});

表达的含义都是一样的,也就是说,prop1只能作为常量被识别,即使它是个变量也没用,例如:

var prop1 = "prop2";
object.push({prop1:"<span style="font-family: Arial, Helvetica, sans-serif;">value1</span>"});

这样通过object访问prop2会出现什么情况呢?比如:

alert(<span style="font-family: Arial, Helvetica, sans-serif;">object.prop2) </span>

不用问,当然是undefined,而访问object.prop1却是"value1"

原因已经说过了,无论加不加引号,属性一律当成常量对待.再举一个例子:

var arr=[];
arr['js']='jquery';
arr['css']='oocss';
var obj={};
for(var i in arr)
{

    obj.i=arr[i];
}
alert(obj.js);

读者不放猜一下alert会打印什么?

当然是undefined.

大家再猜一下,如果alert(obj.i)会打印什么?

当然是oocss,为什么?因为obj现在只有一个属性i,而且通过两次循环,obj.i前面的被后面的覆盖掉.

如果有需求,需要动态添加属性,也就是说,属性也必须是一个变量才行,如上例代码,alert(obj.js)不是undefined,而是jquery,该如何修改呢?

var arr=[];
arr['js']='jquery';
arr['css']='oocss';
var obj={};
for(var i in arr)
{

    obj[i]=arr[i];
}
alert(obj.js);

就是那么简单!把对象obj当成一个数组来对待,它支持使用类似于下标形式的方法来把属性和属性值赋给对象.但是,对象依然是对象,obj.length是不存在的.

时间: 2024-10-19 09:42:35

动态设置js的属性的相关文章

js+jquery动态设置/增加/删除/获取元素属性的两种方法集锦对比(动态onclick属性设置+动态title设置)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html140/strict.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title>

Dynamic CRM 2013学习笔记(二十八)用JS动态设置字段的change事件、必填以及可见

我们知道通过界面设置字段的change事件,是否是必填,是否可见非常容易.但有时我们需要动态地根据某些条件来设置,这时有需要通过js来动态地控制了. 下面分别介绍如何用js来动态设置.   一.动态设置字段的change事件 // form on load event function onLoad() { init();   pageAttr.delivery_from.addOnChange(deliveryFromChange); pageAttr.type.addOnChange(typ

JS动态设置css的几种方式

1. 直接设置style的属性  某些情况用这个设置 !important值无效 如果属性有'-'号,就写成驼峰的形式(如textAlign)  如果想保留 - 号,就中括号的形式  element.style['text-align'] = '100px'; element.style.height = '100px'; 2. 直接设置属性(只能用于某些属性,相关样式会自动识别) element.setAttribute('height', 100); element.setAttribute

:style动态设置属性

前段时间做页面时需要动态设置背景图片,每一种框架都会遇见类似的需求,特记录下来,以免不时之需: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> li span { width: 100px; height: 100px; border-radius

java 反射 根据属性 动态设置值

package com.jhl.jvm.lesson8; import java.lang.reflect.Field; /** * * @author jhl * java 反射 根据属性 动态设置值 demo * */ public class ExceptionLog { private String exceptionLogId; private String processingType; private String type; private String content; pub

DELPHI控件具有多个属性的动态设置方法

本人初学DELPHI,遇到了个比较麻烦的问题就是没办法动态设置有多值的控件属性,在网上找了很多资料收获不大,经过自己研究,找到了一些方法,先记录下来以备使用. 1. 控件只有单一属性值设置方法: form1.Align属性有: alNone,alLeft,alRight,alTop,.....等等,在编程中实现方法 方法1:  form1.Align:=alNone; 或 form1.Align:=alRight ..... 方法2: form1.Align:=TAlign(5); 等同于 fo

用JS 设置 控件 属性

知识靠积累,点滴收获. //设置控件被选中 document.getElementById("id").checked=true; //设置控件不可用 document.getElementById("id").disabled = true; //设置控件不可见 document.getElementById("id").style.display='none'; //设置控件可见 document.getElementById("i

微信小程序首页index.js获取不到app.js中动态设置的globalData的原因以及解决方法

前段时间开发了一款微信小程序,运行了也几个月了,在index.js中的onLoad生命周期里获取app.js中onLaunch生命周期中在接口里动态设置的globalData一直没有问题,结果昨天就获取不到动态设置的global数据了.因为我要获取小程序的unionid以及通过unionid去获取微信的openId,并且共享数据,最开始我是通过storage来做数据共享的,后来测试发现storage存在莫名被清空的情况,后来转用globalData来做数据共享,查了下,是因为app.js中的on

js动态设置select的默认值

根据需求动态的设置select的默认值,若要选定默认则代码selected="selected".动态设置则如下所示: <html> <table> <tr> <td width="250" align="left"> <select name="job" size="1" > <option value="普通会员"&g