jQuery获取前端页面节点

最新推荐文章于 2023-02-23 19:17:46 发布

代码的更新者

最新推荐文章于 2023-02-23 19:17:46 发布

阅读量322

点赞数

本文链接：https://blog.csdn.net/adminmanager1/article/details/105772011

版权

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
    <script src="js/bootstrap.js"></script>
</head>
<script>
    

</script>
<body>
<form id="info">
    <input type="text" id="name">
    <input type="text" id="phone">
    <input type="text" id="sex">
    <button id="btn" onclick="get()"> 获取</button>
</form>
</body>
</html>

jQuery.prev()，返回上一个兄弟节点，不是所有的兄弟节点
jQuery.prevAll()，返回所有之前的兄弟节点数组
jQuery.next(),返回下一个兄弟节点，不是所有的兄弟节点
jQuery.nextAll()，返回所有之后的兄弟节点数组
jQuery.siblings(),返回兄弟姐妹节点数组，不分前后

QUERY的父，子，兄弟节点查找方法
jQuery.parent(expr) 找父亲节点，可以传入expr进行过滤，比如("span").parent()或者("span").parent()或者(“span”).parent(“.class”)
jQuery.parents(expr),类似于jQuery.parents(expr),但是是查找所有祖先元素，不限于父元素
jQuery.children(expr).返回所有子节点，这个方法只会返回直接的孩子节点，不会返回所有的子孙节点
jQuery.contents(),返回下面的所有内容，包括节点和文本。这个方法和children()的区别就在于，包括空白文本，也会被作为一个

1、jQuery.next(),返回下一个兄弟节点

function get() {
        
        var phone= $("#name").next().val();
        alert(phone)
    }

2、jQuery.prev()，返回上一个兄弟节点，不是所有的兄弟节点

function get() {
         var sex= $("#phone").prev().val();
        alert(sex)
    }

3、jQuery.parent() 返回父节点

function get() {

        var id= $("#phone").parent().attr("id");
        alert(id)
    }

4、jQuery.prevAll() 返回之前的所有节点



function get() {

        $("#sex").prevAll().val("dd")
    }

5、jQuery.nextAll() 返回之后的所有节点

function get() {

         $("#name").nextAll().val("dd")
    }

代码的更新者

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫