function make(tagname,attributes,children){
//如果参数的个数为二个,并且属性的类型是数组或是字符串,将当前的属性值赋给孩子
if(arguments.length == 2 && 
(attributes instanceof Array ||  typeof attributes == "string")){
children = attributes;
attributes = null;
}
//创建了一个元素
var e = document.createElement(tagname);
//为新标签设置属性
if(attributes) {
for(var name in attributes)
e.setAttribute(name, attributes[name]);
}

if(children != null){
if(children instanceof Array){
for(var i = 0; i < children.length; i++){
var child = children[i];
if(typeof child == "string"){
child = document.createTextNode(child);
e.appendChild(child);
}
}
}
else if(typeof children == "string"){
e.appendChild(document.createTextNode(children));
}
else e.appendChild(children);
}

return e;

}
以上是js部分,<button onclick="make('table',{border:1},'tr');">click</button>是body里,现在是怎么让新创建的表格显示在指定位置?还有判断Array和string有什么不同,是通过他们去判断什么吗?

解决方案 »

  1.   

    假设你指定位置的标签为div,id="target"
    document.getElementById('target').appendChild(e);//e为你make方法返回的table对象
      

  2.   

    有点启发,写了一个方法:
    function show(e){
    var f = make('table',{border:1},'tr');
    document.getElementById("divId").appendChild(f);
    }
    在html中加了 <div id="divId"></div>,没错,但是还是不展示出来…
      

  3.   

    你添加的div设置宽度高度阿,要不然怎么显示呢???
      

  4.   

    判断string和Array
    if(typeof(obj) == "string") {
    //string
    } else if(Object.prototype.toString.call(obj) == '[object Array]') {
    //Array
    }
      

  5.   

    <div id="divId" style="height:400px;width=200px"></div>像这样?还是没有用…
      

  6.   


    <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
    <%
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
    %><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
        <base href="<%=basePath%>">
        
        <title>My JSP 'deepIn.jsp' starting page</title>
        
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">    
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="This is my page">
    <!--
    <link rel="stylesheet" type="text/css" href="styles.css">
    -->
    <script type="text/javascript">
    //创建任意类型tag
    function make(tagname,attributes,children){
    //如果参数的个数为二个,并且属性的类型是数组或是字符串,将当前的属性值赋给孩子
    if(arguments.length == 2 && 
    (attributes instanceof Array ||  typeof attributes == "string")){
    children = attributes;
    attributes = null;
    }
    //创建了一个元素
    var e = document.createElement(tagname);
    //为新标签设置属性
    if(attributes) {
    for(var name in attributes)
    e.setAttribute(name, attributes[name]);
    }

    if(children != null){
    if(children instanceof Array){
    for(var i = 0; i < children.length; i++){
    var child = children[i];
    if(typeof child == "string"){
    child = document.createTextNode(child);
    e.appendChild(child);
    }
    }
    }
    else if(typeof children == "string"){
    e.appendChild(document.createTextNode(children));
    }
    else e.appendChild(children);
    }
    //alert(e.innerHTML)
    return e;
    }

    function show(e){
    var f = make('table',{border:1},'tr');
    document.getElementById("divId").appendChild(f);
    }
    </script>  </head>
      
      <body><!-- 展示新增任意tag -->
        <button onclick="show('divId');">click</button>
        <div id="divId" style="height:400px;width=200px"></div>
        <br>
        
      </body>
    </html>
      

  7.   

    初步发现是你make方法有问题,你创建的table没有td
      

  8.   


    //创建任意类型tag
    function make(tagname,attributes,children){
    //如果参数的个数为二个,并且属性的类型是数组或是字符串,将当前的属性值赋给孩子
    if(arguments.length == 2 &&  (attributes instanceof Array || typeof attributes == "string")){
    children = attributes;
    attributes = null;
    }
    //创建了一个元素
    var e = document.createElement(tagname);
    //为新标签设置属性
    if(attributes) {
    for(var name in attributes)
    e.setAttribute(name, attributes[name]);
    }
    if(children != null){
    if(children instanceof Array){
    var parent = e;
    for(var i = 0; i < children.length; i++){
    var child = children[i];
    if(typeof child == "string"){
    child = document.createElement(child);
    parent.appendChild(child);
    parent = child;
    }
    }

    }
    else if(typeof children == "string"){
    e.appendChild(document.createTextNode(children));
    }
    else 
    e.appendChild(children);
    }
    return e;
    }function show(e){
    var f = make('table',{border:1,width:'200px',height:'300px'},['tbody','tr','td']);//这里的tbody是tr的父节点,不加tbody这个table就展示不出来,需要加我下面注释掉的那行
    document.getElementById("divId").appendChild(f);
    //document.getElementById("divId").innerHTML = document.getElementById("divId").innerHTML;
    }
      

  9.   

    我总结了一下http://blog.csdn.net/kunkkacoco/article/details/7755397
      

  10.   

    是的,上面代码把那个color标签去掉,我是为了高亮显示的,结果冲突了