JavaScript新手经常遇到的问题（一）
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新手经常遇到的问题（一）的更多相关文章
- 我要成为前端工程师！给 JavaScript 新手的建议与学习资源整理
来源于:http://blog.miniasp.com/post/2016/02/02/JavaScript-novice-advice-and-learning-resources.aspx 今年有 ...
- javascript新手实例1-DOM基本操作
学习javascript好多同学不知道怎么上手,跟着网上的新手教程做了一遍又觉得javascript很简单,但是真正自己用起来又觉得写不出什么东西,我觉得学习最好的方法就是跟着有趣的例子做,所以我们的 ...
- SuperMap iClient for JavaScript 新手入门
地理信息系统(英语:Geographic Information System,缩写:GIS)是一门综合性学科,结合地理学与地图学,已经广泛的应用在不同的领域,是用于输入.存储.查询.分析和显示地理数 ...
- JavaScript新手学习笔记1——数组
今天,我复习了一下JavaScript的数组相关的知识,总结一下数组的API: 总共有11个API:按照学习的先后顺序来吧,分别是: ① toString() 语法:arr.toString(); ...
- JavaScript新手学习笔记3——三种排序方式（冒泡排序、插入排序、快速排序）
每种编程语言学到数组的时候,都会讲到排序算法,当时学C语言的时候,卡在排序算法.今天来总结一下javascript中如何实现三种排序算法. 1.冒泡排序(默认升序排列哦) 原理: 冒泡排序的原理,顾名 ...
- Javascript新手集中营
javascript是世界上最流行的编程语言,也许没有之一,看看github,stackoverflow上面的开源项目和问答就可略知一二.它可以用来开发web app.服务器.或者联合nati ...
- 【从无到有】JavaScript新手教程——1.简介、变量和运算符
今天带大家来学习一下在网页制作过程中很常用的JavaScript(简称JS). 一.JS的作用: 表单验证,减轻服务端的压力 添加页面动画效果 动态更改页面内容 Ajax网络请求 二.[使用JS的 ...
- JavaScript新手学习笔记（一）
1.JavaScript 对大小写敏感. JavaScript 对大小写是敏感的. 当编写 JavaScript 语句时,请留意是否关闭大小写切换键. 函数 getElementById 与 getE ...
- JavaScript 新手的踩坑日记
引语 在1995年5月,Eich 大神在10天内就写出了第一个脚本语言的版本,JavaScript 的第一个代号是 Mocha,Marc Andreesen 起的这个名字.由于商标问题以及很多产品已经 ...
随机推荐
- 我对C++开发人员有偏见
前言 我确实对C++开发人员有一些偏见,我也知道对一类人有偏见是不正确的行为:但,在我所处的三线城市的环境中,我对C++开发有偏见并非是一件不正确的事,因为C++开发都是变态这件事,根本就是客观事实. ...
- vps配置脚本备个份
#!/bin/bash apt-get update -y apt-get dist-upgrade -y apt-get install -y nmap vim build-essential gc ...
- 无聊的 邮递员 插头dp
邮递员想知道,如果他每天都用不同路线走过10×20个点阵邮筒,他必须活过多少个世纪才能走遍所有方案? 7:00 改完T1,开始肝插头dp 7:10 放弃,颓博客 7:20 学习插头dp 7:21 放弃 ...
- 基于xposed逆向微信、支付宝、云闪付来实现个人免签支付功能
我的个人网站如何实现支付功能? 想必很多程序员都有过想开发一个自己的网站来获得一些额外的收入,但做这件事会遇到支付这个问题.目前个人网站通过常规手法是无法实现支付管理的,所有支付渠道都需要以公司的身份 ...
- svn:"Update item to this version"、"Revert to this version"及"Revert changes from this version"详细说明
背景: 今天在svn分支上做了一些课题性研究,发现当前的环境版本不稳定, 和领导研究后决定还原到前面的版本以继续进行课题. 问题: 因此遇到了问题,是应该选择“Update item to this ...
- js基础总结03 --操作数组
修改于 2019-11-10 1 length:长度 <script> var arr = [1,2,3,4,5,6,7,8]; console.log(arr.length);//arr ...
- VNC的安装以及使用
VNC (Virtual Network Console)是虚拟网络控制台的缩写.它 是一款优秀的远程控制工具软件,由著名的 AT&T 的欧洲研究实验室开发的.VNC 是在基于 UNIX 和 ...
- Linux 项目 shell 自动获取报告本机IP (1) | 通过shell 自动获取报告本机IP
由于电脑设置静态IP经常出现链接不上网络,动态IP又非常不方便,故有了这个想法并实现 原理: Linux,包含PC机器,树莓派等,通过shell 自动获取报告本机IP | 通过 Mutt+Msmtp ...
- Jmeter与压测相关概念
相关概念 RT(response time) 什么是RT? RT就是指系统在接收到请求和做出相应这段时间跨度 但是值得一提的是RT的值越高,并不真的就能说明我们的系统的吞吐量就很高, 比如说,如果存在 ...
- SpringBoot Web篇（二）
摘要 继上一篇 SpringBoot Web篇(一) 文件上传 当我们服务器需要接收用户上传的文件时,就需要使用MultipartFile作为参数接收文件.如下: @PostMapping(" ...