jquery插入html
可以用樓上的方法,也可以用如下方式,
<div class="a1">
<div class="b">bbb</div>
<div class="c">ccc</div>
</div>
<script type="text/javascript">
<!--
$(function(){
$(".a1").after("<div class='a2'></div>");
$(".a1 .c").appendTo($(".a2"));
})
-->
</script>
這兩種方法都是jquery中的基本用法中的一種,
它還有很多方法在網上可以搜到jquery的幫助文檔,有興趣的話可以看看,它裡麵包括很多,
其中ajax和一些ui框架在我們做web開發時經常用到而且很方便
⑵ jquery如何動態的添加一條html代碼
添加新內容的四個 jQuery 方法:
append() - 在被選元素的結尾插入內容
prepend() - 在被選元素的開頭插入內容
after() - 在被選元素之後插入內容
before() - 在被選元素之前插入內容
jQuery append() 方法
jQuery append() 方法在被選元素的結尾插入內容。
實例:
$("p").append("Some appended text.");
jQuery prepend() 方法
jQuery prepend() 方法在被選元素的開頭插入內容。
實例:
$("p").prepend("Some prepended text.");
通過 append() 和 prepend() 方法添加若干新元素
上面的例子中,我們只在被選元素的開頭/結尾插入文本/HTML。
但是append() 和 prepend() 方法能夠通過參數接收無限數量的新元素。可通過 jQuery 來生成文本/HTML或者通過 JavaScript 代碼和 DOM 元素。
下面創建若干個新元通過 text/HTML、jQuery 或 JavaScript/DOM 來創建。通過 append() 方法把這些新元素追加到文本中(對 prepend() 同樣有效):
實例:
function appendText()
{
var txt1="<p>Text.</p>"; // 以 HTML 創建新元素
var txt2=$("<p></p>").text("Text."); // 以 jQuery 創建新元素
var txt3=document.createElement("p"); // 以 DOM 創建新元素
txt3.innerHTML="Text.";
$("p").append(txt1,txt2,txt3); // 追加新元素
}
jQuery after() 和 before() 方法
jQuery after() 方法在被選元素之後插入內容;jQuery before() 方法在被選元素之前插入內容。
實例:
$("img").after("Some text after");
$("img").before("Some text before");
通過 after() 和 before() 方法添加若干新元素
after() 和 before() 方法能夠通過參數接收無限數量的新元素。可以通過 text/HTML、jQuery 或者 JavaScript/DOM 來創建新元素。
下面創建若干新元素通過 text/HTML、jQuery 或JavaScript/DOM 來創建。然後通過 after() 方法把這些新元素插到文本中(對 before() 同樣有效):
實例:
function afterText()
{
var txt1="<b>I </b>"; // 以 HTML 創建新元素
var txt2=$("<i></i>").text("love "); // 通過 jQuery 創建新元素
var txt3=document.createElement("big"); // 通過 DOM 創建新元素
txt3.innerHTML="jQuery!";
$("img").after(txt1,txt2,txt3); // 在 img 之後插入新元素
}
⑶ 怎樣用jquery添加HTML代碼
1.$(".demo").html("<span></span>")
2.var$span=$("<span></span>");
$(".demo").append($span)
⑷ 怎麼在jquery中在div中加一段html
<style>
.box1{
width:600px;
height:300px;
border:6pxsolid#bb0000;
}
h1{
border-bottom:1pxsolidgreen;
}
</style>
<divclass="box1">
點擊改變內容
</div>
<scriptsrc="http://code.jquery.com/jquery.js"></script>
<script>
$('.box1').click(function(event){
$(this).html('=========================================================這是新添貼==================================');
});
</script>
⑸ jquery 添加html()後 如何再刪除
html() 方法返回或設置被選元素的內容 (inner HTML)。
如果該方法未設置參數,則返回被選元素的當前回內容。答
如果要刪除已經添加的內容有如下方法
1、如果原來內容就為空,將內容置為空即可
$(selector).html("")
2、如果原來有內容,可以使用再使用html()方法將內容再寫一次。
⑹ 如何用jQuery動態在某個DIV里寫入HTML代碼
本篇文章是對在Jquery中把一段html代碼動態寫入到DIV中的實現方法進行了詳細的分析介紹版,需要的朋友可以參權考下 復制代碼 代碼如下: nav1 = "<div style='width:145px;height:62px;float:left;background:url(login_image/index/on_1.jpg);font-size:18px;color:white;line-height:65px;' id='left_tab" + "</div>" 復制代碼 代碼如下: $("#top_1").html(nav1);說明:top_1是body中的一個div的ID!
⑺ jQuery如何用.html(),插入到指定ID一段js代碼,詳情如下
這樣加進去的js會執行嗎?應該不會吧。
⑻ jQuery如何向HTML添加指定的內容
$(document).ready(function(){
$("#btn2").click(function(){
$("<input type='text' name='ddd' id='ddd' value='Hello, Nowamagic' ><br>").appendTo("#ccc");
});
$("#btn1").click(function(){
$("#nowamagic").append("<input type='text' name='ddd' id='ddd' value='Hello, Nowamagic' ><br>");
});
});
這里我們必須來知道一點,就是 append 和 appendTo 的區自別:append 單純的內容,appendTo 要把內容傳給某個元素。
這個函數的用法有很多,比如你可以按需要追加form,在區域內追加圖片等等都是可以的。
⑼ jquery點擊插入html,再點擊就刪除剛插入的這段html
<pcalss="addRemove"><!--假設這里是擊插入html,再點擊就刪除剛插入的這段html的區域--></p>
$(".addRemove").click(function(){
//設插入html的同時也為當前元素添加一個標識addHtml類名;
if($(this).hasClass("addHtml")){
//此時存在addHtml類,表示已插入了內容,接下來應該刪掉,同時刪掉addHtml類名;
$(this).html("");
$(this).removeClass("addHtml");
}else{//不存在addHtml類名,接下來要添加html內容,同時也添加addHtml類名;
$(this).html(/*要插入的html內容*/);
$(this).addClass("addHtml");
}
});
⑽ jquery中input框能插入html嗎
你好:
input元素是不可以的,插入的話也是源代碼;
如果你想實現某種效果,建議使用div+js,實現的方法很多;
希望可以幫助到你;