jquery創造元素_如何用jquery創建一個dom元素

❶ jquery 動態創建元素的方式介紹及應用

一般動態創建元素可以通過兩種方式
1、Dom
HTml
復制代碼
代碼如下:
var
select
=
document.createElement("select");
select.options[0]
=
new
Option("載入項1",
"value1");
select.options[1]
=
new
Option("載入項2",
"value2");
select.size
=
"2";
testDiv.appendChild(select);
});
通過document的createElement方法創建，然後通過appendChild方法添加到指定的對象中即可
2、JQuery函數創建
$("<div
style=\"border:solid
1px
#FF0000\">動態創建的div</div>")
通過append，appendto，prepend，prependto等方法添加到指定的對象中，具體可以查看
http://www.jb51.net/article/35845.htm
3、頁面載入的時候最好在頁面載入完後執行創建
可以使用window.onload,但是在添加新的元素,
但是不幸的是瀏覽器執行window.onload函數不僅僅是在構建完DOM樹之後,
也是在所有圖像和其他外部資源完整的載入並且在瀏覽器窗口顯示完畢之後.
所以如果某個圖片或者其他資源載入很長時間,
訪問者就會看到一個不完整的頁面,
甚至在圖片載入之前就執行了需要依賴動態添加的元素的腳本而導致腳本錯誤.
解決辦法就是等DOM被解析後,
在圖像和外部資源載入之前執行我們的函數.在jQuery中讓這一實現變得可行
復制代碼
代碼如下:
$(document).ready(
function()
{
testDiv.innerHTML
=
"<div
style=\"border:solid
1px
#FF0000\">使用動態創建的$(document).ready(function)方法</div>";
}
);
或者使用簡便語法:
復制代碼
代碼如下:
//jQuery
使用$(function)方法
$(
function()
{
testDiv.innerHTML
+=
"<div
style=\"border:solid
1px
#FF0000\">使用$(function)方法</div>";
}
);
使用$()將我們的函數包裝起來即可.
而且可以在一個頁面綁定多個函數,
如果使用傳統的window.onload則只能調用一個函數.
所以請大家將修改DOM的函數使用此方法調用.
另外還要注意document.createElement和innerHTML的區別.
如果可以請盡量使用document.createElement和$("<div/>")的形式創建對象.

❷ 如何用jquery創建多個元素

var num = 8;
for (var i = 0; i < num; i++) {
$('ul').append('<li></li>');
};

❸ jquery中怎樣創建元素，並且添加class

a在同級可這樣
$('#wrapper-250 a').bind('click', function(){
    $(this).addClass('class').siblings().removeClass('class');
});

不在同級：
$('a').bind('click', function(){
    $('a').removeClass('class');
    $(this).addClass('class');
});

❹ javascript/jquery怎麼操作通過ajax動態創建的元素

<head>
<metacharset="utf-8">
<title></title>
<script>
functionCheckForm(){
varbox=document.getElementById("box");
varhtml_str="";
#.ajax({
url:"klist.php"
type:"get",
dataType:"json",
success:function(k){
for(vari=0;i<k.length;i++){
varitem=k[i];
//alert(item.name);
varchk='';
if(item.chk)chk='checked="true"';
html_str+='<inputtype="checkbox"name="msk[]"value="'+item.name+'"'+chk+'/>&nbsp;'+item.name+'';
}
box.innerHTML=html_str;
},

});

}
</script>
</head>
<bodyonload="javascript:CheckForm();">
<divid="box">
</div>
</body>
</html>

//klist.php
<?php
echojson_encode([{name:"張三",chk:true},{name:"張三2",chk:false},{name:"張三3",chk:true},{name:"張三4",chk:false}]);
?>

❺ jquery是怎麼創建jquery類的

使用jquery創建新元素的方法為：$(html標簽)，例如 $("<p></p>")創建了一個段落。注意此時只是創建了對象，尚未添加到文檔節點中去；以下四個 jQuery 方法可以添加新內容到文檔樹中：
append() - 在被選元素的結尾插入內容
prepend() - 在被選元素的開頭插入內容
after() - 在被選元素之後插入內容
before() - 在被選元素之前插入內容
下面進行實例演示：點擊「添加」按鈕，新建一個input文本框
1、HTML結構
<input type="text" id="test_input">
<input type='button' value='添加'/>
2、javascript代碼
$(function(){
$("input[type='button']").click(function() {
new_obj = $("<input type='text'>");
$(this).before(new_obj);
});
});

❻ jquery創建元素的一個問題

<divclass="div1"></div>

	<scripttype="text/javascript">
vara="<a>";
$(a).addClass("a").text("some").appendTo($(".div1")).css("color","yellow");//生效
$('.a').css("font-size","24px");
</script>

這樣試試

❼ jquery怎麼獲取動態創建的元素

這要看你動態創建的元素用的什麼標記
$('#domId').html();
$('.domClass').html()

❽ jquery動態生成元素

先給一個正確的。
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>無標題文檔</title>
<script type="text/javascript" src="jquery/jquery-1.4.2.js" ></script>
</head>

<body>
<div id="testDiv">ssss</div>
<script type="text/javascript" language="javascript">
$(document).ready(function(){
$("<div/>").css("border","solid 1px #FF0000").html("動態創建的div").appendTo('#testDiv');
});
</script>

</body>
</html>

你的代碼有這么幾個錯誤。
1。css裡面，顏色不用那麼多0.要6位數
2。appendTo的時候，既然用了id來查找div。必須用#+id

❾ 如何用jquery創建一個dom元素

使用jquery創建新元素的方法為：$(html標簽)，例如$("<p></p>")創建了一個段落。注意此時只是創建了對回象，答尚未添加到文檔節點中去；以下四個 jQuery 方法可以添加新內容到文檔樹中：

append() - 在被選元素的結尾插入內容
prepend() - 在被選元素的開頭插入內容
after() - 在被選元素之後插入內容
before() - 在被選元素之前插入內容

下面進行實例演示：點擊「添加」按鈕，新建一個input文本框

1、HTML結構

<inputtype="text"id="test_input">
<inputtype='button'value='添加'/>

2、javascript代碼

$(function(){	
	$("input[type='button']").click(function(){
		new_obj=$("<inputtype='text'>");
		$(this).before(new_obj);
	});
});

3、顯示效果

初始樣式

❿ jQuery 動態創建元素失去焦點

可能是你的jquery版本太低，太低的live不支持blur，fouce等事件，好像是1.4以上才支持，你看看是不是這個原因，如果支持的話，直接：

$("#id").live('blur',function(){
...
});

另外，可以試著用bind，而不是live

導航:首頁 > 創造發明 > jquery創造元素

jquery創造元素

與jquery創造元素相關的資料