JQ-DOM与元素的操作

最新推荐文章于 2021-12-01 17:26:23 发布
最新推荐文章于 2021-12-01 17:26:23 发布
阅读量126 收藏
点赞数
文章标签： javascript ViewUI
原文链接：http://www.cnblogs.com/hy96/p/11556732.html
版权 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
<div class="box">
    <span>hello jq</span>
</div>
</body>
<script src="../jquery.js"></script>
<script>

    // 创建并插入
     console.log($("div"))
//
//    //创建：
     var d = $("<div>");
//
//    //body被div插入了：
     $("body").append(d);
//
//    // 把div插入到body
     d.appendTo($("body"));
//
     $("body").prepend(d); //插到最上面。body下面的第一个
     d.prependTo($("body"));//同上

     $("body").before(d);   //插到body的前面，同级
     $("body").after(d) ; //插到body的后面

    // 删除
     $(".box").remove(); //删除box
     $(".box").empty();   //box里面的元素设置为空

    // 改
     $(".box").replaceWith("<p class='"+ $(".box").attr("class") +"'>"+ $(".box").html() +"</p>"); //将box改为p标签，若想p标签里面的内容与box一样，就需要进行字符串拼接

    // 查 就是选择器
</script>
</html>

 

转载于:https://www.cnblogs.com/hy96/p/11556732.html

anhumi4350
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
jq-mobile案例
02-05
2. **数据链接（Data-Linking）**：jq-mobile使用"data-"属性进行数据绑定，自动更新DOM元素，简化了视图与模型之间的交互。 3. **增强型表单（Enhanced Forms）**：jq-mobile对HTML表单元素进行了优化，增加了诸如...
jQuery操作元素、事件处理
weixin_61561066的博客
07-24 1652
jQuery操作元素、事件处理
jQuery中的元素操作
qq_49956121的博客
09-21 817
一、元素内容操作 元素内容操作是jQuery对元素文本的DOM 操作。 1、html()获取HTML中的内容 2、html(“val”)设置HTML中的内容 3、text()获取文本 注意：结果是由所有匹配元素包含的文本内容组合起来的文本。 4、text(“text”)设置文本 注意：之前存在的值全部清除，只保留修改的值，设置所有匹配元素文本。 5、val()获取元素值 6、val(“value”)设置元素值 注意：之前存在的值全部清除，只保留修改的值，设置所有匹配元素文本。 二、元素属性操作 元素属
JQuery操作元素
Lucky1019的博客
12-01 228
1、元素固有属性-prop(例如:href、type等) 获取属性: prop('属性') 设置属性: prop('属性','属性值') 注意：prop() 除了普通属性操作，更适合操作表单属性：disabled / checked / selected 等。 2、元素自定义属性值-attr 用户自己给元素添加的属性，称为自定义属性。获取属性: attr('属性') //类似js中的getAttribute() 设置属性: attr('属性','属性
jQuery对元素、节点的操作
weixin_38654336的博客
06-16 1638
一、文本内容的操作方法：①text()  ②text(val)例子：$div = $(‘div’) //获取div元素  Console.log($div.text())  //获取文本内容      $div.text(“aaaaa”) //设置了文本的内容二、HTML内容的操作①html():用于获取第一个匹配元素的HTML内容②html(val)：用于设置全部匹配元素的HTML内容注意：内容...
jQuery_元素操作
大脸猫~
06-25 662
一.高度和宽度 获取高度： $(&amp;quot;div&amp;quot;).height(); // 高度 $(&amp;quot;div&amp;quot;).width(); //宽度 设置高度： $(&amp;quot;div&amp;quot;).height(300); $(&amp;quot;div&amp;quot;).height(“300px”);
jQuery 实现DOM元素拖拽交换位置的实例代码
10-15
在网页中实现 DOM 元素的拖拽功能能够让用户通过直观的方式进行元素的排序、移动等操作，从而提升网站的交互性和用户体验。本文介绍利用 jQuery 库来实现 DOM 元素拖拽并交换位置的功能。以下是需要掌握的核心知识点...
jQuery利用sort对DOM元素进行排序操作
10-21
示例中提到了*** MVC视图代码，我们可以看到如何通过遍历服务器返回的模型集合，为每个元素动态添加`data-sort`属性，并用该属性进行DOM元素的排序操作。 ### 总结 总的来说，jQuery的`sort()`方法为我们提供了灵活...
使用jQuery监听DOM元素大小变化
10-22
在JavaScript和jQuery的世界里，有时候我们需要监听DOM元素的尺寸变化，以便在元素尺寸改变时执行特定的操作。jQuery的`resize`事件通常用于监听窗口大小的变化，但jQuery还提供了一种扩展，使得我们可以将`resize`...
login_jquery和jq-UI源码_
09-30
1. **选择器**：jQuery提供了丰富的CSS选择器，使得选取DOM元素变得简单直观。 2. **链式操作**：所有jQuery方法返回的都是jQuery对象，允许我们进行连续调用。 3. **事件处理**：jQuery封装了事件处理，简化了跨...
jq 操作元素内容
weixin_43294560的博客
11-12 290
操作元素内容 **返回元素的所有内容，包括子标签** 对象数组.html(); function t1() { var showdiv=$("#showdiv"); alert(showdiv.html()); } **返回元素的内容，不包括子标签** 对象数组.text(); function t4() { var ...
利用Jquery对动态元素进行操作
zerlinda_c的博客
12-09 4107
今天写了一点jquery的代码，姑且先存放的博客上吧。　　默认样式是这样的，需要的是click其中的td时实现对其内容的修改，而blur后显示的是修改后的内容： 　　　　　　 　　单击url 的td元素之后是这样的： 　　　　　　　　 　　单击method的td元素之后是这样的： 　　　　　　　　 　　需求很简
JQ操作元素的方法 - js篇
阿莹yes的博客
08-03 647
目录获取元素节点添加元素appendChild()append()prepend()appendTo()prependTo()操作同级节点before()after()insertBefore()insertAfter()删除元素removeChid()remove( [selector] )remove()empty()复制节点clone()替换节点$(selector).replaceWith(content)$(content).replaceAll(selector)包裹节点wrap()wrapAl
总结一下jQuery操作元素节点的方法（创建、选择、插入节点）
热门推荐
xinghuo0007的博客
05-08 1万+
知识点一：创建节点注意：Jquery创建元素节点、属性节点、文本节点都使用$(html)1.创建元素节点：$("<li></li>"); 2.创建属性节点：$("<li id='test'></li>"); 3.创建文本节点：$("hello world !"); 4.下面是创建三者的结合：$("<li id='test'>hello world !</li>"); 解释：4是创建一个id属性为te
jQuery操作元素
DAYDAYUP
05-20 336
jQuery操作元素常用 获取内容 (“#test”).text();(“#test”).text();(“#test”).text(); (“#test”).html(); $(“#test”).val() 获取属性 $(“#test”).attr(“href”) 设置或者修改属性 (“#XXX”).attr(“disabled”,”disabled”);(“#XXX”).att...
使用jQuery操作DOM重点总结
妖精小狗的博客
09-14 8040
DOM操作分为三类： DOM Core：任何一种支持DOM的编程语言都可以使用它，如getElementById() HTML-DOM：用于处理HTML文档，如document.forms CSS-DOM：用于操作CSS，如element.style.color="green" 注：JavaScript用于对(x)html文档进行操作，它对这三类DOM操作都提供了支持   jQuery对...
jQuery系列之添加元素或文本+jQ操作(六)
dapyandxpy的博客
06-15 971
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript" src="jquery-3.2.1.js"></script> <script type="text/javascript">
原生javascript取代jquery的一些方法（jQuery-free）
Reid的专栏
03-24 3310
转自：http://www.qingdou.me/2687.html jQuery是最流行的JavaScript工具库。据统计，目前全世界57.3%的网站使用它。也就是说，10个网站里面，有6个使用jQuery。如果只考察使用工具库的网站，这个比例就会上升到惊人的91.7%。 jQuery如此受欢迎，以至于有被滥用的趋势。许多开发者不管什么样的项目，都一股脑使用jQuery。但是，
jQuery 操作元素
wyy的博客
04-22 113
01、操作元素的属性 $(function(){ $("#but").click(function(){ //获得元素的对象 var inp=$("#zh"); //JQ获得属性 inp.attr("value")：获得的默认的值 console.log(inp.attr("type")+"----"+inp.attr("name")+"----"+inp.attr("value")); /* console.log(
jq监听dom大小变化
最新发布
09-03
jQuery提供了一个方法用于监听DOM元素的大小变化，即resize()方法。可以通过这个方法监听浏览器窗口大小的改变。 使用resize()方法的语法如下： $(window).resize(function(){ // 在这里编写处理大小变化的代码 })...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值