", {　　　　"class": "my-div",　　　　on: {　　　　touchstart: function( event ) {　　　　// do som" /> ", {　　　　"class": "my-div",　　　　on: {　　　　touchstart: function( event ) {　　　　// do som" /> ", {　　　　"class": "my-div",　　　　on: {　　　　touchstart: function( event ) {　　　　// do som" />

首页 / 知识

创建一些 DOM 元素实例解析

2023-04-11 13:30:00

创建一些 DOM 元素实例解析
　　从 jQuery 1.8开始, 任何jQuery实例方法（一个jQuery.fn的方法），可以被用来作为一个该对象的属性传递给第二个参数：
　　
　　$( "<div></div>", {
　　
　　"class": "my-div",
　　
　　on: {
　　
　　touchstart: function( event ) {
　　
　　// do something
　　
　　}
　　
　　}
　　
　　}).appendTo( "body" );
　　
　　在这个对象中，"class"（类）的名称必须使用引号括起来，因为它是一个JavaScript保留字，还有不能使用"className"，因为它是指的DOM属性（property），不是属性（attribute）。
　　
　　虽然第二个参数是方便，它的灵活性可能会导致意想不到的后果（例如$("<input>", {size: "4"})调用.size()方法，代替设置size属性）。上面的代码块可以被写入，代替为：
　　
　　$( "<div></div>" )
　　
　　.addClass( "my-div" )
　　
　　.on({
　　
　　touchstart: function( event ) {
　　
　　// do something
　　
　　}
　　
　　}).appendTo( "body" );
　　
　　例子:
　　
　　Example: 动态创建一个 div 元素(以及它的内容)，并将它追加到 body 元素后。在 jQuery 内部是通过所指定元素的 innerHTML 属性对新生成的元素进行赋值的。
　　
　　$( "<div><p>Hello</p></div>" ).appendTo( "body" )
　　
　　Example: 创建一些 DOM 元素。
　　
　　$( "<div/>", {
　　
　　"class": "test",
　　
　　text: "Click me!",
　　
　　click: function() {
　　
　　$( this ).toggleClass( "test" );
　　
　　}
　　
　　}).appendTo( "body" );

元素方法参数属性实例方法对象

最新内容

相关内容

热门文章

推荐文章

标签云

猜你喜欢