有关CSS、JS、JQuery的琐碎记录

时间：2021-01-29 23:22:52 阅读：22 评论：0 收藏：0 [点我收藏+]

1、截取字符串

（1）slice(start,[end])

//用slice删除字符串前几位字符，和删除最后一个字符
this.allId = this.allId.slice(0,this.allId.length - 1); //删除最后一个字符串
this.allId = this.allId.slice(4); //删除前四个
this.allId = this.allId.slice(-4); //删除后四个

（2）substring(start,[end])

this.allId = this.allId.substring(0,this.allId.length - 1); //删除最后一个字符串

（3）substr(start,[length])

2、JS替换指定字符

（1）split("XX")：切割字符串，返回数组

（1）replace()：替换字符串中第一个指定字符（只能替换第一个）

str.replace("Item","");    //只能替换第一个Item

想要全部替换的办法：使用正则（单纯替换字母可以）

str.replace(/Item/g,"");     //结合正则表达式，“/xxx/g”，xxx为指定字符
//类似于replaceall的方法，js里面没dao有单独的replaceall方法但是用正则实现replaceall,写法就是values.replace(/你要替换成的新字符串/g, "老的字符串");当然替换成“”就是去掉为空了

3.JS多个条件判断

目的：判断变量是否在数组中存在

// （1）对象序列(Object) 推荐使用这一种
var obj = {‘CJ‘:‘成交‘, ‘WCJ‘:‘未成交‘}; 
if (key in obj) {
    // ……
}
// （2）数组序列(Array)
var array = [‘CJ‘, ‘WCJ‘];
if ($.inArray(value, array) != -1) {
    // ……
}
if (array.indexOf(value) != -1) {
    // ……
}

View Code

4.判断字符串中是否包含某个字符串

（1）方法一: indexOf() (推荐)

indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。如果要检索的字符串值没有出现，则该方法返回 -1。

var str = "123";
console.log(str.indexOf("3") != -1 ); // true

（2）方法二: search()

search() 方法用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符串。如果没有找到任何匹配的子串，则返回 -1。

var str = "123";
console.log(str.search("3") != -1 ); // true

（3）方法三:match()

match() 方法可在字符串内检索指定的值，或找到一个或多个正则表达式的匹配。

var str = "123";
var reg = RegExp(/3/);
if(str.match(reg)){
    // 包含 
}

5.字符串转Json

（1）字符串转Json对象

var obj = JSON.parse(str);    //方法一 
var obj = str.parseJSON();    //方法二
var obj = $.parseJSON(data);    //方法三
var obj = eval(‘(‘ + str + ‘)‘);    //方法四

View Code

然后，就可以这样读取：Alert(obj.name);
注意：如果obj本来就是一个JSON对象，那么使用eval（）函数转换后（哪怕是多次转换）还是JSON对象，但是使用parseJSON（）函数处理后会有问题（抛出语法异常）

（2）JSON对象转JSON字符串

var last=JSON.stringify(obj);    //方法一
var last=obj.toJSONString();    //方法二

View Code

注意：使用JSON.parse时，返回来的数据一定是严格的json格式，key值一定要用【双引号】包起来，否则浏览器会抛出异常。
　　另外，对于不标准的json字符串，如第一种示例，使用eval()虽然可以正常解析，但是从安全的角度来讲，一定要谨慎使用eval方法。规范json格式。

1、jQuery插件支持的转换方式：
示例：
$.parseJSON( jsonstr ); //jQuery.parseJSON(jsonstr),可以将json字符串转换成json对象
2、浏览器支持的转换方式(Firefox，chrome，opera，safari，ie)等浏览器：
示例：
JSON.parse(jsonstr); //可以将json字符串转换成json对象
JSON.stringify(jsonobj); //可以将json对象转换成json对符串
注：ie8(兼容模式),ie7和ie6没有JSON对象，推荐采用JSON官方的方式，引入json.js。
3、Javascript支持的转换方式：
eval(‘(‘ + jsonstr + ‘)‘); //可以将json字符串转换成json对象,注意需要在json字符外包裹一对小括号
注：ie8(兼容模式),ie7和ie6也可以使用eval()将字符串转为JSON对象，但不推荐这些方式，这种方式不安全eval会执行json串中的表达式。
4、JSON官方的转换方式：
http://www.json.org/提供了一个json.js,这样ie8(兼容模式),ie7和ie6就可以支持JSON对象以及其stringify()和parse()方法；

-------

（19）JSON.stringify()
JSON.stringify() 方法用于将 JavaScript 值转换为 JSON 字符串。
语法：JSON.stringify(value[, replacer[, space]])
参数说明：
value:必需，要转换的 JavaScript 值（通常为对象或数组）。
replacer:可选。用于转换结果的函数或数组。
如果 replacer 为函数，则 JSON.stringify 将调用该函数，并传入每个成员的键和值。使用返回值而不是原始值。如果此函数返回 undefined，则排除成员。根对象的键是一个空字符串：""。
如果 replacer 是一个数组，则仅转换该数组中具有键值的成员。成员的转换顺序与键在数组中的顺序一样。
space:可选，文本添加缩进、空格和换行符，如果 space 是一个数字，则返回值文本在每个级别缩进指定数目的空格，如果 space 大于 10，则文本缩进 10 个空格。space 也可以使用非数字，如：\t。

6.div控件中元素操作

（1）循环遍历div下的所有元素

var nodes = $("table.form input");
for (var i = 0; i < nodes.length; i++) {
    var hid = nodes[i].id;
    if ($("#" + hid).val().length <= 0 && hid != "ContractId" && hid != "B_6") {
        ValidationMessage($("#" + hid), "不能为空！")
        return false;
    }
}
//JS选中除某个元素外的其他元素
使用jQuery 遍历中的 not() 方法
$("div.content *").not(".keep"); // 表示content类的div下除keep类以外的所有元素

（2）选中除某个以外控件

$("div.content *").not(".keep");

7.删除数组中的指定元素

var index = RemarkList.indexOf(data.Remark); //获取元素所在的位置
if (index > -1){
    //结合索引和splice()方法 
    this.splice(index, 1);
}

参考地址：https://www.cnblogs.com/mmzuo-798/p/7551917.html

8.JS中的日期处理

（1）获取当前日期

var date = new Date();
date.getFullYear() /getMonth() /getDate() //年月日
date.getDay()/.getMinutes()/getSeconds() //星期几；
//获取yyyy-mm-dd字符串的值代码如下：
var date = new Date("你需要的日期例如：2015-10-1"); 
var mon = date.getMonth() + 1;
var day = date.getDate();
var nowDay = date.getFullYear() + "-" + (mon<10?"0"+mon:mon) + "-" +(day<10?"0"+day:day);
//mon变量就是月份；day变量就是日子；变量nowDay就是输出的yyyy-mm-dd格式的日期字符串。
//(mon<10?"0"+mon:mon)当月份小于10月的时候就会在月份前加0；
//(day<10?"0"+day:day)当日子小于10号时会在前加0；
//date.getFullYear()就是年份；输出nowDay就会获得想要的日期字符串了。

（2）dateTime加一年

//起始日期如果是2012.1.1,则结束日期是2012.12.31
//起始日期如果是2012.1.2,则结束日期是2013.1.1，以此类推。
//实现：
var d1=new Date("2012/01/1");
var d2=new Date(d1);
d2.setFullYear(d2.getFullYear()+1);
d2.setDate(d2.getDate()-1);
alert(d2.toLocaleString());

9.向json数组中添加数据

（1）往数据里添加json字符串

var arr = []
var json = {"name":"chao","sex":"男"}
arr.push(json)
console.log(arr)    //结果：[{"name":"chao","sex":"男"}]

（2）往数组的json字符串里新增数据

var j =[{"name":"chao","sex":"男"}]; 
j[0].age=‘18‘
console.log(j)    //结果：{name: "chao", sex: "男", age: "18"}

10.给 json对象添加属性的5种方式

var test={name:"wang",age:"12"};
（1）直接 json对象打点属性添加

test.id = "12345"; //{ name : ‘wang‘ , age : 12 , id : ‘12345‘ }
//例如：
var queryJson = $("#filter-form").GetWebControls();//获取form内所有控件内容
queryJson.LockMark = "1";

（2）json对象 ["属性"] 添加

test["id"] = "12345";

（3）newParam 添加

test.newParam = ‘sex‘;//添加一个 sex属性:
test.sex = ‘男‘‘;
console.log(test); //{ name : ‘wang‘ , age : 12 , sex : ‘男‘ }

（4）使用 Object.assign() 函数

var o1 = {a:1};
var o2 = {b:2};
var o3 = {c:3};
var obj = Object.assign(o1,o2,o3);
console.log(obj);//{a: 1, b: 2, c: 3}
//注意目标对象自身也会改变 (第一个参数为目标参数,其余不会变)
console.log(o1);//{a: 1, b: 2, c: 3}

（5）使用 Jquery 的继承方法

a={‘a‘:1};
b={‘b‘:2};
c=$.extend(a,b) 
//或者
c=$.extend({},a,b)
console.log(c);    //{a: 1, b: 2}

11.jQuery中的merge()方法

$.merge() 函数用于合并两个数组内容到第一个数组。

$.merge( first, second )
//first Array类型 第一个用于合并的数组，合并后将包含第二个数组的内容
//second Array类型 第二个用于合并的数组，该数组不会被修改

注意：merge虽然是合并数组的方法，但是不能直接用merge，要写$.merge()。merge方法执行后直接返回a1，a1得到的是把a2合并到a1里的两个数组的数组，a2本身不发生变化

12.JS中<a>标签内文字修改

GFlag = GFlag == "P" ? "D" : "P";
var a = document.getElementById("lr-changegrid").innerText;
document.getElementById("lr-changegrid").innerText = a == "切换到月" ? "切换到年" : "切换到月";

13.给input标签赋值

给input标签赋值时。要用$("#B_2").val(m);而不是$("#B_2").val=m；

//限制input只能输入数字： 
<input id="B_2" type="text" class="form-control" onkeyup="this.value=this.value.replace(/[^\d]/g,‘‘)" onafterpaste="this.value=this.value.replace(/[^\d]/g,‘‘)" >

14.外部调用的js文件写法

JS文件需注意：当会影响其他文件时，要把function XXXX()改成checkedRow = function XXX()

　　　　　　调用时定义一个变量接收，如var result=function XXX()即可实现调用

15.查找table中tr的数量

var files = $("#fileupload table").find("tr").length;

16.有关jqGrid

（1）通过点击获取当前行数据

ondblClickRow: function(rowid, iRow, iCol, e){
var rowData = $(grid_selector).jqGrid("getRowData", rowid);
　　...
}

（2）jqgrid多选框

//1.方法开头定义
var selectedRowIndex = 0;
//2.jqgrid中加入属性
multiselect: true,
onSelectRow: function () {
    SelectRowIndx = GetJqGridRowIndx("#" + this.id);
},
gridComplete: function () {
    $("#" + this.id).jqGrid(‘setSelection‘, SelectRowIndx);
}

17.JSON动态赋值——当不知道属性名时

var queryJson = {};
var condition = $("#queryCondition").find(‘.dropdown-text‘).attr(‘data-value‘);
var keyword = $("#txt_Keyword").val();
queryJson[condition] = keyword;

18.获取select控件选中值

//控件：
<select name="slTradingState" id="slTradingState" class="sui-select" style="width: 200px;">
<option selected="selected" value="">--请选择--</option>
<option value="博内尔">博内尔</option>
<option value="国(地)别不详">国(地)别不详</option>
</select>

//取值：
$("#slTradingState option:selected").text()
//赋值：
$("#slTradingState option:selected").text(“hello world”)

19.JS前端调用后台代码

注意点：1.方法前添加[WebMethod]; 　　2.必须生命static静态方法　　3.jQuery.ajax 　　4.注意传参格式："{‘str:‘" + A + "}"

//前端：
jQuery.ajax({
    url: "ContractDetail.aspx/PostThreeC",
    data: "{‘varchk3C‘:‘" + varchk3C + "’}",
    type: "POST",
    dataType: "json",
    contentType: "application/json; charset=utf-8",
    success: function (data) {
    }
});

//后台:
[WebMethod]
public static bool PostThreeC(string varchk3C)
{
    var strsql = "update A_HKOut_m set is3C=1 where HKout_m_id in (" + varchk3C + ")";
    DbHelperSQL.ExecuteSql(strsql);
    return true;
}

20.当使用ajax提交数据调用Action报错：不存在所需的防伪表单字段“__RequestVerificationToken”

对应解决办法：
1.在提交的entity数据中添加["__RequestVerificationToken"]属性
2.在ajax参数中添加__RequestVerificationToken参数。

//JS代码：
var entity = { Id: id, B_6: result };
entity["__RequestVerificationToken"] = $("[name=__RequestVerificationToken]").val();
$.ajax({
    url: "/CustomsManage/CustomsBizLicence/SaveEntity",
    data: { entity: entity, __RequestVerificationToken:    entity["__RequestVerificationToken"] },
    type: "post",
    dataType: "json",
    async: false,
    success: function (data) {
        ReloadTableGrid(layui.table.cache.InspectionTable);
    }
});

//调用的Action：
[HttpPost]
[ValidateAntiForgeryToken]
[AjaxOnly]
public ActionResult SaveEntity(CustomsBizLicenceEntity entity)
{
    customsbizlicencebll.SaveEntity(entity);
    return Success("操作成功。");
}

21.URL地址中包含带有“#”等特殊字符的处理方法

如果在页面跳转参数中的参数包含“#”等特殊字符，需要先转换一下，转换方式是：

使用js的内置函数escape，escape会将“#”转换为“%23”；
在另外一个页面调用是再利用逆向函数unescape将“%23”转换为“#”；

22.indexOf() 方法

//indexOf() 方法的四种形式：
public int indexOf(int ch): 
//返回指定字符在字符串中第一次出现处的索引，如果此字符串中没有这样的字符，则返回 -1。
public int indexOf(int ch, int fromIndex): 
//返回从 fromIndex 位置开始查找指定字符在字符串中第一次出现处的索引，如果此字符串中没有这样的字符，则返回 -1。
int indexOf(String str): 
//返回指定字符在字符串中第一次出现处的索引，如果此字符串中没有这样的字符，则返回 -1。
int indexOf(String str, int fromIndex): 
//返回从 fromIndex 位置开始查找指定字符在字符串中第一次出现处的索引，如果此字符串中没有这样的字符，则返回 -1。

23.JQuery获取勾选行的列值

function GetCheckListObject() {
    var ids = $("#gridTable").jqGrid(‘getGridParam‘, ‘selarrrow‘)
    var res = [];
    if (ids.length > 0) {
        for (var i = 0; i < ids.length; i++) {
        res.push($("#gridTable").jqGrid(‘getRowData‘, ids[i]))
    }
}
    return res;
}

JavaScript push() 方法
JavaScript Array 对象

定义和用法
push() 方法可向数组的末尾添加一个或多个元素，并返回新的长度。
语法:arrayObject.push(newelement1,newelement2,....,newelementX)
//newelement1 必需。要添加到数组的第一个元素。
//newelement2 可选。要添加到数组的第二个元素。
//newelementX 可选。可添加多个元素。
//注释：该方法会改变数组的长度。
提示：要想数组的开头添加一个或多个元素，请使用 unshift() 方法。

24.placeholder属性

提供可描述输入字段预期值的提示信息。该提示会在输入字段为空时显示，并会在字段获得焦点时消失。

//例子：
<input type="search" name="user_search" placeholder="请输入邮箱" />

25.将ViewBag的值传递给js变量

//后端：
ViewBag.id=“张三”;
//前端：
var id = "@ViewBag.id"; 
//或者
var id=‘@ViewBag.id‘

26.JS 页面之间传递json数据

一般情况下两个页面之间的简单的数据传递，可以通过url后边添加参数的方式赋值，但如果是比较复杂的json串的数据，通过这种方式就会有各种问题，浏览器的地址栏会对url中的字符串进行一些默认处理，一些直接将对象转换成字符串传递，接收到字符串不能直接转换成对象(比较头疼的问题)；还有页面加载先后的问题。
我是通过sessionStorage进行存储传递数据的。
1.存储数据

sessionStorage.setItem("allJson", JSON.stringify(json));//将获取到的json字符串，保存到键为allJson中。

2.获取数据

var hh = sessionStorage.getItem("allJson");//获取键为allJson的字符串
var pp = JSON.parse(hh);//将字符串抓换成对象

3.对象与字符串的相互转换

var str=JSON.stringify(json);//对象转换成字符串
var aa=JSON.parse(str);//字符串转成对象

有关CSS、JS、JQuery的琐碎记录

原文：https://www.cnblogs.com/Yan3399/p/14346447.html

踩

(0)

评论一句话评论（0）

分享档案

更多>

2021年09月23日 (328)
2021年09月24日 (313)
2021年09月17日 (191)
2021年09月15日 (369)
2021年09月16日 (411)
2021年09月13日 (439)
2021年09月11日 (398)
2021年09月12日 (393)
2021年09月10日 (160)
2021年09月08日 (222)