zoukankan      html  css  js  c++  java
  • php学习笔记之javascript与jquery的对比讲解

    *课前提示相对于js中的复杂 冗长的单词,语言 jquery就显得简单粗暴许多但有一部分jquery是无法完成的这时候就需要js的帮助。

    jquery与js的对比:

    jquery其实大致上可以理解为是js的的升级版 ,所以jquery的功能比较强大一些,用起来也会比较方便。但是两者都是属于js的  而jquery其实算是一个封装类的js ,做特效会比较方便一些并且两者可以串着使用

    在页面中能不使用js就别用相对于jquery ,js太麻烦,但是想要使用jquery引用 你需要引用一个jquery包  网上能找到

    (同一个版本下一般找到的jquery包中的命名格式是:jquery-版本号.min.js或jquery-版本号.js;区别min的是一个压缩版他将所有字符全部压缩,且体积较小;没有经过压缩的js比较大;只要版本不是特别老一般都能用)

    直接上代码 

    //JS方式
    //1.根据ID取元素,DOM对象
    //var div = document.getElementById("one");
    //2.根据class取元素
    //var div = document.getElementsByClassName("test");
    //3.根据name取
    //var bd = document.getElementsByName("uid");

    //4.根据标签名取
    //var div = document.getElementsByTagName("div");

    //操作内容
    //1.非表单元素
    //alert(div.innerText);
    //div.innerText = "aaaa";
    //div.innerHTML;
    //2.表单元素
    //div.value

    //操作属性
    //div.setAttribute("","");
    //div.removeAttribute("");
    //div.getAttribute("");

    //操作样式
    //div.style.backgroundColor = "red";
    //alert(div.style.color);只能获取内联样式

    //在数组里面如果要取DOM对象使用索引的方式,如果要取Jquery对象使用eq()

    //JQUERY方式
    //1.根据ID取元素,Jquery对象
    //var div = $("#one");
    //2.根据class取
    //var div = $(".test");
    //3.根据属性取
    //var bd = $("[bs='aa']");
    //4.根据标签名取
    //var div = $("div");
    //5.组合选取
    //a.var div = $(".test [name='aa']");
    // alert (div[0]);
    // b.var div = $("div.test");后代关系是针对于标签来说的
    // alert(div[0]);
    //var div = $("div span");
    // alert(div[0]);

    //操作内容
    //1.非表单元素
    //alert(div.text());
    //div.text("aaaa");
    //div.html();
    //2.表单元素
    //div.val("aaa");

    //操作属性
    //div.attr("test","aa");
    //div.removeAttr("test");
    //div.attr("test");

    //操作样式
    //div.css("background-color","yellow");
    //alert(div.css("color"));

    //操作元素
    //var str = "<div id='a' style='100px; height:100px; background-color:red'></div>";

    //div.append(str); //追加元素
    //$("#a").remove(); //移除某个元素

    /*$(".test").click(function(){
    alert($(this).text());

    })*/

  • 相关阅读:
    零基础学python-2.15 回到我们的游戏 加入for以及列表
    零基础学python-2.14 for循环语句
    零基础学python-在3.x版本之后的print()不换行
    零基础学python-2.13 回到我们的游戏 加入循环
    CSV文件读取
    jmeter 测试webservice协议soap接口
    jmeter-plugins-manager.jar插件安装
    JDBC协议(jmeter链接mysql)
    xftp连接centos7
    xshell连接centos7
  • 原文地址:https://www.cnblogs.com/koker/p/5601339.html
Copyright © 2011-2022 走看看