2_JQuery对象与JS对象之间的转换

JQuery对象和JS对象区别与转换
    1. JQuery对象在操作时,更加方便。
    2. JQuery对象和js对象的方法不通用的.
    3. JQuery对象和js对象两者之间如何相互转换
        * jq -- > js : jq对象[索引] 或者 jq对象.get(索引)
        * js -- > jq : $(js对象)

举例:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="js/jquery-3.3.1.min.js"></script>
</head>
<body>
<div id="id_div1">div1...</div>
<div id="id_div2">div2...</div>

<script>
    //一、采用js方式进行处理.通过js方式来获取名称叫div的所有html元素对象
    var js_div = document.getElementsByTagName("div");
    alert(js_div.length); //可以将js_div当做数组使用,我么测试其长度,结果为:2
    //将div标签体中的所有内容变为aaa
    for(var i=0;i<js_div.length;i++){
        js_div[i].innerHTML = "aaa";
    }

    alert("js->JQuery")
    //js对象与JQuery对象之间相互转换。js ->JQuery,格式:  $(js对象)
    $(js_div[1]).html("bbb");


    //二、采用JQuery方式进行处理。通过JQuery方式来获取名称叫div的所有html元素对象
    var JQ_div = $("div");
    alert(JQ_div.length);//JQ_div也可以作为数组使用
    //将div标签体中的所有内容改为ccc
    for(i=0;i<JQ_div.length;i++){
        JQ_div.html("ccc");
    }

    alert("JQuery->js");
    //js对象与JQuery对象之间相互转换。JQuery -> js,格式:JQuery对象[索引].属性或方法 <=>JQuery对象.get(索引).属性或方法
    JQ_div[0].innerHTML="ddd";
    JQ_div.get(1).innerHTML="eee";
</script>

</body>
</html>

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值