jquery动态创建div与input

最新推荐文章于 2023-07-17 10:27:13 发布

转载最新推荐文章于 2023-07-17 10:27:13 发布 · 1.9k 阅读

本文介绍使用jQuery库动态创建HTML元素的方法。通过实例展示了如何利用jQuery动态生成div和input元素，并为这些元素添加交互行为。

无意中发现的，做为收藏，以备后绪查看时用。

<html>

<head>

<title>jjquery动态创建div与input</title>

<script type="text/javascript" src="jquery-1.4.2.min.js"></script>

<script>

<!--动态创建div-->

$(function (){

    $("<div>",{

        id:'text',

        text:'this is a test',

        "class":"text",

        click:function(){

        $(this).toggleClass('test');

    }

}).appendTo("body");

})

<!--动态创建input-->

$(function(){

    $("<input>",{

    type:'text',

    val:'text',

    function:function(){

        $(this).addClass('active');

    },

    focusout:function(){

        $(this).removeClass('active');

    }

}).appendTo("div");

})

</script>

</head>

<body></body>

</html>