动态创建 div table

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <script src="jquery.min.js"></script>
    <script type="text/javascript">

        $(function () {

            //创建表格
            var dic = { "百度": "http://www.baidu.com", "搜狐": "http://www.sohu.com", "谷歌": "https://www.goolge.com" };
            var objtab = $("<table border=‘1‘></table>").appendTo($("body"));

            for (var i in dic) {
             //   alert(i);
                $("<tr> <td>" + i + "</td><td>"+"<a href="+dic[i]+">" + dic[i] + "</td></a></tr>").appendTo(objtab);

            }

            $("#btn1").click(function () {

                //创建DIV

                //$(‘<a href="https:www.baidu.com"></a>‘).text("百度").appendTo($("body"));

                var div1 = $("<div></div>").css("width", "200px").css("height", "200px").css("backgroundColor", "green").css("position", "absolute").css("right", "0px").css("bottom", "0px").appendTo($("body"));
                $("<span><span>").text("关闭").css("float", "right").css("cursor", "pointer").click(function () {

                    $(this).parent().hide();

                }).appendTo(div1);

            })
        });

    </script>
</head>
<body>
    <input type="button" value="jQuery" id="btn1" />
</body>
</html>
时间: 2024-10-11 09:44:05

动态创建 div table的相关文章

《项目经验》--后台一般处理程序向前台JS文件传递JSON,JS解析JSON,将数据显示在界面--显示在DropDownList 或 显示在动态创建的table中

http://blog.csdn.net/mazhaojuan/article/details/8599167 先看一下我要实现的功能界面: 这篇文章主要介绍:后台一般处理程序把从数据库查找的数据,转换成JSON,然后传递到前台JS文件中,JS解析JSON数据,并将数据显示在界面,主要介绍两种显示方式,显示在DropDownList控件 or 显示在动态创建的Table表中.   本文主要介绍两个地方: 1.根据学年查询学期信息的实现--JS将解析的JSON数据绑定到DropDownList框

2016.3.11_JS动态创建div和span【笔记】

1.动态创建div. <html> <body>   <a href="javascript:click();">click here</a>  </body></html><script language=javascript>        var divId=1;         function click()        {            var obj=document.creat

前端学习代码实例-JavaScript动态创建div并写入文本

介绍一下如何利用JavaScript动态创建div元素,然后在其中写入文本. 代码实例如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>web前端开发学习扣qun:731771211

Javascript动态创建div

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-

jquery 动态创建 DIV

方法一: var creatediv= function(){    var parentdiv=$('<div></div>');        //创建一个父div    parentdiv.attr('id','parent');        //给父div设置id    parentdiv.addclass('parentdiv');    //添加css样式 var childdiv=$('<div></div>');        //创建一个

html综述一 -- jQuery基础使用(动态在body中创建div节点)

1 动态创建节点 详细说明请查看点击此处查看 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-type" content="text/html; charset=utf-8" /> <title> 这是使用 jquery的第一个案例 </title> <style> .hh{ width: 200px; height:1

oaf 动态创建table vo (转)

原文地址:如何动态创建table 需求: 因为系统中有几千个QA plan 但是不能手动创建几千个 质量收集页面所有需要根据 不同的plan 动态创建对应的 质量收集页面. 但是创建tabel 都要绑定一个 具体的vo  而我需要一个动态的如果用 select ... from dual 的话 字段的个数如何动态? 感谢答主sumury 方案0.1版本 //用以下的代码可以实现,但是有一点不足,就是当数据量比较多的时候,无法按照指定的行数进行分页显示. //先在页面上创建一个advancedTa

js基础例子动态创建table实例

<style> table{ width:500px; font-weight: bold; border: 1px solid #000; border-collapse:collapse; font-size:20px; text-align:center; margin: 0 auto; } td{ border: 1px solid #000000; } </style> <script> window.onload=function () { //创建一个数据

js动态创建及移除div的方法

本文实例讲述了js动态创建及移除div的方法.分享给大家供大家参考.具体实现方法如下: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 //创建div function createDiv(){  if(document.getElementByIdx_x("newD")!=null)   document.body.removeChild(document.getElementByIdx_x(&q