Jquery Operator DOM

转载 2012年03月24日 13:32:46


Dom 与 Jquery


Jquery命名规范:获取的元素对象  变量名一般以$+变量名
document对象:直接变量名


1)查找节点




2)创建节点
Normal method
var input=document.createElement("input(元素名)");
input.setAttribute("type(属性名)","text(值)");
document.getElementById("shame").append=input;//附加


Jquery method
$("p").append("html元素");
$("<b>hello<b/>").appendTo("p");//将元素附加到哪里
$("p").prepend("html元素");将元素附加到p元素的前面
$("<br>hello</>").prependTo("p");
$("p").after("html元素");//插入兄弟元素
$("<br>hello<br/>").insertAfter("p");//将元素插入到p的后面
$("p").before("html");//将p插入到html元素前面




normal element operator
 
var div=document.getElmentById("sharme");
var br=document.createElement("br");//create element
var input=document.createElement("input");
var button=document.createElement("input");

input.setAttribute("type","file");//set element of attribute


button.setAttribute("type","button");
button.setAttribute("value","sharmeYao");


button.onclick=function(){
div.removeChild(br);//remove child node
div.removeChild("input");
div.removeChild("button");
}
div.appendChild(br);//append child node
div.appendChild(input);//jquery   br.remove();//元素对象实现移除本身




div.appendChild(button);


$("#sharme").append(br).append(input).append(button);//jquery achieve append child nodes














DOM元素用jquery进行复制


    $("ul li").click(function(){//这句代码隐含了一个循环ul节点所有子节点的循环

$(this).clone().appendTo("ul");//将循环的子节点this对象,clone复制一份,然后appendTo指定元素上
    })






替换Dom节点元素


$("p").replaceWith("<div>sharme<div>");//用div这个元素替换当前页面上的所有p元素


$("<div>sharme</div>").replaceAll("p");//用前面的div替换页面所有的p元素






Dom元素的包裹


 $("p").wrap("<a href="www.bugutang.com"></a>");//这里是将p元素包裹起来
内容是<a href="www.bugutang.com"><p>sharme</p></a>//将p这个元素放置到后面<a href></a>元素中


  $("p").wrapInner("a href="www.bugutang.com></a>");//包裹p元素的文本


<p><a href="www.bugutang.com">sharme</a></p>








---------------jquery的 AJAX请求
$.ajax({


type:"get",    //请求方式
url:"sharme.do?method=addTo", //请求的url
dataType:"html/xml/application/json",//响应文本数据格式
success:function(data){//ajax回调函数响应数据
alert(data);
}
});




-----运用jquery  中AJAX方法中的参数来解决get和post请求的问题    注意在访问路径后面拼接参数的方法请求永远都是get的请求
$.ajax({


type:"post",
url:"myServlet",
dataType:"html", //这里的类型不写的话,默认为html
data:{"name":"sharme","sex":"man","age":20},   //这里可以采用json的格式传递参数
success:function(data){
alert(data);
}
});




---------rederect use ajax 直接使用ajax post


$.post("url",{name:parame1,age:parame2},function(returnData,status){
//status表示状态  成功就调用回调函数  成功为2.0
。。。。。。回调函数执行的代码段
});



相关文章推荐

Jquery中的DOM操作 (四.复制和替换节点)

clone;replaceWith;replaceAll;

jQuery 基础DOM和CSS操作

要点: 设置元素及内容 元素属性操作 元素样式操作

jQuery学习笔记之DOM操作、事件绑定(2)

jQuery学习笔记之DOM操作、事件绑定(2) 4.DOM操作 5.事件绑定 源码地址: https://github.com/iyun/jQueryDemo.git 4.DOM操作(节点增删改查)...

jquery 对象 与dom对象

1.4  jQuery对象和DOM对象1.4.1  简介DOM对象和jQuery对象第一次学习jQuery,经常会搞不清楚哪些是jQuery对象、哪些是DOM对象,所以需要重点了解它们以及它们之间的关...

jquery中得dom操作(部分)

一般来说dom操作分为三个方面 也就是DOM core (dom核心) html-dom 和css-dom append()向每个匹配元素的内部追加元素,$("p").append("你好"); 我...

jQuery对象与DOM对象之间的转换方法

刚开始学习jQuery,可能一时会分不清楚哪些是jQuery对象,哪些是DOM对象。至于DOM对象不多解释,我们接触的太多了,下面重点介绍一下jQuery,以及两者相互间的转换。 什么是jQuery对...

DOM对象和JQuery对象的区别

1.jQuery对象和DOM对象 第一次学习jQuery,经常分辨不清哪些是jQuery对象,哪些是 DOM对象,因此需要重点了解jQuery对象和DOM对象以及它们之间的关系. DOM对象,即是...

jQuery对象与DOM对象之间的转换方法

什么是jQuery对象? —就是通过jQuery包装DOM对象后产生的对象。jQuery对象是jQuery独有的,其可以使用jQuery里的方法。 比如: (“#test”).html() 意...

jQuery对象和dom对象的区别和相互转换

jQuery对象和dom对象的区别和相互转换

jQuery基础教程之DOM操作-节点操作函数(一)

jQuery基础教程之DOM操作-节点操作函数(一) 发表于 2011 年 01 月 20 日 由 梦三秋 jQuery作为Javascript的一个强大的库,其对DOM对象的操作之...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)