js 用CreateElement动态创建标签示例_javascript技巧-js tutoriel-php.cn

js 用CreateElement动态创建标签示例_javascript技巧

WBOY

Libérer： 2016-05-16 17:13:41

original

1178 Les gens l'ont consulté

//定义方法创建一个label标签
//*************************************//

 
var createLabel = function(id, name, value) { 
var label_var = document.createElement("label"); 

var label_id = document.createAttribute("id"); 
label_id.nodeValue = id; 

var label_text = document.createTextNode(value); 

label_var.setAttributeNode(label_id); 
var label_css = document.createAttribute("class"); 
label_css.nodeValue = "select_css"; 
label_var.setAttributeNode(label_css); 
label_var.appendChild(label_text); 

return label_var; 
} 

//*************************************//
//定义方法创建input标签（主要为Text）
//id,name,value,type 分别代表创建标签的id,
// 名称（name），值（value），类型（type）
// 绑定Input方法事件，绑定方式如下（可以同时绑定多个事件方法）：
// "onchange==alert('This Value is change success !');|onblur==alert('This value is the beautiful one !');"
//*************************************//

复制代码代码如下:

//******************************************************************//
//定义方法创建一个Select选择框的标签；
//***** id 表示标签的标识id
//***** name 表示标签的名称name
//***** options表示标签要绑定的选择项（例如："0231A563-专业类服务|02312177-维保类服务|……")
//***** splitstr表示用来分割options的字符（如：'|')
//***** splitchar表示分割键值对的分隔符（如：'-'）
//***** event 表示此标签对应的事件（当event==null时此标签不绑定事件）
//******************************************************************//

复制代码代码如下:

var createSelect = function(id, name, options, splitstr, splitchar, event, selectedValue) {
var var_select = null;
try {//处理IE6.0和IE7.0的兼容问题。
var_select = document.createElement("

//***************************************************//
//定义方法创建一个标签；
//***** id表示标签唯一表示id
//***** name表示标签的名称name
//***** value表示标签对应显示的文字（名称）
//***** event表示标签对应的事件（当event==null时事件不绑定）
//***** href表示标签的链接属性
//***************************************************//

复制代码代码如下:

var createA = function(id, name, value, event, href, target) {
var var_a = null;
try {
var_a = document.createElement(""); //这里创建必须为""这种形式来创建否者不支持IE6.0和IE7.0
} catch (e) {
var_a = document.createElement("a");
}
var a_id = document.createAttribute("id");
a_id.nodeValue = id;
var a_name = document.createAttribute("name");
a_name.nodeValue = name;
href = (href == null || href == "") ? ("javascript:void(0);" || "#") : href;
var a_href = document.createAttribute("href");
a_href.nodeValue = href;

var a_Text = document.createTextNode(value);

var_a.setAttributeNode(a_href);
var_a.setAttributeNode(a_id);
var_a.setAttributeNode(a_name);
if (target != null) {
var target_href = document.createAttribute("target");
target_href.nodeValue = "_blank";
var_a.setAttributeNode(target_href);
}

if (event != "" && event != null && event != undefined) {
var a_click = document.createAttribute("onclick");
a_click.nodeValue = event;
var_a.setAttributeNode(a_click);
}
var_a.appendChild(a_Text); //注意这个值绑定顺序，只能放在最后去绑定（不然不支持IE6.0和IE7.0）

return var_a;
}

//******************************************//
//定义方法判断输入值是否为数字；
//******* 当flag=true时判断输入值是否为整数；
//******************************************//

复制代码代码如下:

 
var check_Is_Num = function(obj, flag) { 
var flag_var = false; 
var num = /^\d+$/; ///^\+?[1-9][0-9]*$/; 
//flag_var = /^(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*))$/.test(obj); 
flag_var = /^\d+(\.\d+)?$/.test(obj); 
if (flag) { 
flag_var = num.test(obj); 
} 
return flag_var; 
} 

//定义方法删除节点。 
var removeRowItem = function(obj) { 
var rowTr = obj.parentNode.parentNode; 
try { 
rowTr.removeNode(true); 
} catch (e) { 
rowTr.parentNode.removeChild(rowTr); 
} 
} 

String.prototype.Trim = function() { 
return this.replace(/(^\s*)|(\s*$)/g, ""); 
} 