1、:before和:after，position: absolute;才可以调节高宽

2、判断背景颜色

$(this).css("background-color")=="rgb(95, 158, 160)" ，注加空格

$(this).css("background-color")==“red”是错误的

注意：一定要在background加的color，未改颜色之前是rgba(0, 0, 0, 0)

3、用Class，点击事件

    <div class="dic" name="div1"></div>

    <div class="dic" name="div4"></div>

    <div class="dic" name="div2"></div>

    <div class="dic" name="div3"></div>

    <script>

        $(".dic").click(function(){

            //注意一定要在background加的color，未改颜色之前是rgba(0, 0, 0, 0)

            if ($(this).css("background-color")=="rgb(95, 158, 160)") {

                $(this).css("background","red");

                alert($(this).attr("name"));    //用prop获取不到name

            } else{

                //对比字符串上加上了空格,弹出了true

//              alert($(".dic").css("background")) //对比

                $(this).css("background","cadetblue");

            }

        })

    </script>

4、获取父元素

//获取当前所有父元素的查找"td"的第一个的文本

$(this).parents().find("td").eq(0).text();

5、jQuery.data() 方法

data() 方法向被选元素附加数据，或者从被选元素获取数据。

6、Java和JavaScript的初始数据的不同

var color;

alert(color)//显示的是undefined

String color；//这个显示的是null

注：建议用alert获取JavaScript的初始数据

7、JavaScript动态添加元素如果不设定它的顺序，它的顺序就随机出现

 //翡翠寓意

    setTimeout(function(){

        $.ajax({

            url:"ProductsSelect?action=Moral",

            type:"get",

            dataType:"json",

            success:function (data) {

                var $div="<div class='divproduer' style='margin-top: 23px;'>";

                for (var i=0;i<data.length;i++){

                    var obj=data[i];

​

                    $div+="<span style='margin-right: 15px; cursor:pointer;' class='sMoral'>"+obj.moral+"</span>";

                }

                $div+="</div>";

                $("#top-right").append($div);               //注：顺序是随机的

            },

            error:function (xhr,textStatus,errorThrown) {       //失败回调

                alert("错误，"+textStatus+","+errorThrown);

            }

        })

    }, 300);

8、select的name传值，

<select name="education">

　　<option value="高中">高中</option>
　　<option value="专科">专科</option>
　　<option value="本科">本科</option>
　　<option value="博士">博士</option>

</select>

9、form提交方式

这样不能将数据提交给后台

<input type="button" value="批量删除"/>

form表单中的传递方法有<button>和<input type="submit">两种，他们的功能是一样的
注：如果form没有写action属性的话，就只能在url后面加"?title=..."数据，只不过使用<button>可以显示"?title=..."，<input type="submit">不显示

10、获取子类数据

<body>

  <div>

    <span>Hello</span>

    <p class="selected">Hello Again</p>

    <div class="selected">And Again</div>

​

    <p>And One Last Time</p>

  </div>

  <!--children:孩子们-->

<script>alert($("div").children(".selected").eq(0).text());</script>

</body>

11、jq获取相邻元素的上一个或下一个

相邻元素下一个

//只能获取下一个

$(this).next().val();

//获取全部下一个，这里指定元素

$(this).nextAll(".col-total").val();

相邻元素上一个

//只能获取上一个

$(this).prev().val();

//获取全部上一个，这里指定元素

$(this).prevAll(".col-total").val();

12、JavaScript的return 

retrun true； 返回正确的处理结果。

return false；返回错误的处理结果，终止处理。

return；把控制权返回给页面。

​

<a href="abc.htm" onclick="return add_onclick()">Open</a>

注：如果函数 add_onclick() 返回 true, 那么 页面就会打开 abc.htm；否则, (返回 false), 那么页面不会跳转到 abc.htm, 只会执行你的 add_onclick() 函数里的内容.

13、form改变路径

 //改变form表路径

    $("#souform").click(function () {

        $("#form1").prop("action","/jstl/queryGoods");

        $("#form1").submit();

    })

14、在页面里显示另外一个页面

<iframe src="页面的路径" width="97%" height="80%"></iframe>

15、排序和点击时切换方法

html:

<input type="button" @click="compare2" value="排序"/>

js：

var vm=new Vue({

        el:"#app4",

        data:{

            fruits:[{

                    'name': 'abc',

                    'age': 20

                },{

                    'name': 'cde',

                    'age': 19

                },{

                    'name': 'dfc',

                    'age': 25

                },{

                    'name': 'bde',

                    'age': 21

                }],

            biaoji:1//标记

        },

        methods:{

            compare:function (property) {

                //做标记，注这里可以使用this

                if (this.biaoji==1){

                    this.biaoji=2;

                } else {

                    this.biaoji=1;

                }

                return function (a, b) {

                    //判断是否等于1，注这里不能使用this，必须vm才行

                    var two;

                    if (vm.biaoji==1){

                        two=b[property] - a[property];

                    }else {

                        two=a[property] - b[property];

                    }

                    return two//排序

                }

            },

            compare2:function () {

                // alert(vm.fruits.age);

                vm.fruits.sort(vm.compare("age"))

            }

        }

    })

    //项目：vue2_01
 

JavaScript新手经常遇到的问题（一）的更多相关文章

  1. 我要成为前端工程师！给 JavaScript 新手的建议与学习资源整理

    来源于:http://blog.miniasp.com/post/2016/02/02/JavaScript-novice-advice-and-learning-resources.aspx 今年有 ...

  2. javascript新手实例1-DOM基本操作

    学习javascript好多同学不知道怎么上手,跟着网上的新手教程做了一遍又觉得javascript很简单,但是真正自己用起来又觉得写不出什么东西,我觉得学习最好的方法就是跟着有趣的例子做,所以我们的 ...

  3. SuperMap iClient for JavaScript 新手入门

    地理信息系统(英语:Geographic Information System,缩写:GIS)是一门综合性学科,结合地理学与地图学,已经广泛的应用在不同的领域,是用于输入.存储.查询.分析和显示地理数 ...

  4. JavaScript新手学习笔记1——数组

    今天,我复习了一下JavaScript的数组相关的知识,总结一下数组的API: 总共有11个API:按照学习的先后顺序来吧,分别是: ① toString()  语法:arr.toString(); ...

  5. JavaScript新手学习笔记3——三种排序方式（冒泡排序、插入排序、快速排序）

    每种编程语言学到数组的时候,都会讲到排序算法,当时学C语言的时候,卡在排序算法.今天来总结一下javascript中如何实现三种排序算法. 1.冒泡排序(默认升序排列哦) 原理: 冒泡排序的原理,顾名 ...

  6. Javascript新手集中营

        javascript是世界上最流行的编程语言,也许没有之一,看看github,stackoverflow上面的开源项目和问答就可略知一二.它可以用来开发web app.服务器.或者联合nati ...

  7. 【从无到有】JavaScript新手教程——1.简介、变量和运算符

    今天带大家来学习一下在网页制作过程中很常用的JavaScript(简称JS).   一.JS的作用: 表单验证,减轻服务端的压力 添加页面动画效果 动态更改页面内容 Ajax网络请求 二.[使用JS的 ...

  8. JavaScript新手学习笔记（一）

    1.JavaScript 对大小写敏感. JavaScript 对大小写是敏感的. 当编写 JavaScript 语句时,请留意是否关闭大小写切换键. 函数 getElementById 与 getE ...

  9. JavaScript 新手的踩坑日记

    引语 在1995年5月,Eich 大神在10天内就写出了第一个脚本语言的版本,JavaScript 的第一个代号是 Mocha,Marc Andreesen 起的这个名字.由于商标问题以及很多产品已经 ...

随机推荐

  1. Appium的加载过程

    appium运行流程 Appium的加载过程如上图. 1)调用Android adb完成基本的系统操作: 2)向Android上部署bootstrap.jar: 3)Bootstrap.jar For ...

  2. Java零基础入门面向对象之多态

    多态: 多态的概念:一种事物的多种形态:允许不同类的对象对同一消息做出不同的响应 多态的前提:继承,重写:向上转型(父类引用指向子类对象) 多态的作用:提高代码的可用性:降低模块之间的耦合度 多态分类 ...

  3. NOIP模拟 7

    考试最后半小时发现T1过不去任何样例,T飞,发现没调用solv函数,挽回40分 考试最后几分钟给T2测了一组自制样例,发现了bug,挽回20分 天- -检查这么重要的么(其实是我第一次打的时候就没验证 ...

  4. 01-MyBatis启动流程分析

    目录 MyBatis简单介绍 启动流程分析 简单总结 附录 MyBatis内置别名转换 参考 MyBatis简单介绍 MyBatis是一个持久层框架,使用简单,学习成本较低.可以执行自己手写的SQL语 ...

  5. Linux基于webRTC的二次开发(二) 实现远程桌面共享

    webRTC中的desktop_capture模块提供了捕获桌面和捕获窗口的相关功能,而实现远程桌面共享功能需要将desktop_capture捕获的画面作为peerconnection的视频源,下面 ...

  6. 大宇java面试系列（一）：jvm垃圾回收

    1. 说一下 JVM 有哪些垃圾回收算法? 标记-清除算法:标记无用对象,然后进行清除回收.缺点:效率不高,无法清除垃圾碎片. 标记-整理算法:标记无用对象,让所有存活的对象都向一端移动,然后直接清除 ...

  7. 今天做一个项目的时候，要在一个编辑的jsp页面的textarea标签设置value属性，结果发现他没有value属性，但是是编辑页面又必须要回显要修改的内容，所以在参考了w3cschool之后很轻松的解决了这个问题。

    今天做一个项目的时候,要在一个编辑的jsp页面的textarea标签设置value属性,结果发现他没有value属性,但是是编辑页面又必须要回显要修改的内容,所以在参考了w3cschool之后很轻松的 ...

  8. [LC] 700题 Search in a Binary Search Tree （二叉搜索树中的搜索） （二叉搜索树）

    ①中文题目 给定二叉搜索树(BST)的根节点和一个值. 你需要在BST中找到节点值等于给定值的节点. 返回以该节点为根的子树. 如果节点不存在,则返回 NULL. 例如, 给定二叉搜索树: 在上述示例 ...

  9. nyoj 305 表达式求值 （递归）

    表达式求值 时间限制:3000 ms  |  内存限制:65535 KB 难度:3   描述 Dr.Kong设计的机器人卡多掌握了加减法运算以后,最近又学会了一些简单的函数求值,比如,它知道函数min ...

  10. lqb 基础练习 回文数

    基础练习 回文数 时间限制:1.0s   内存限制:512.0MB     问题描述 1221是一个非常特殊的数,它从左边读和从右边读是一样的,编程求所有这样的四位十进制数. 输出格式 按从小到大的顺 ...