7.6心得

最新推荐文章于 2024-07-12 14:10:05 发布

weixin_34410662

最新推荐文章于 2024-07-12 14:10:05 发布

阅读量79

点赞数

文章标签： javascript c# ViewUI

原文链接：http://www.cnblogs.com/vvva/p/7130335.html

版权

网页后退
<input type=button value=刷新 οnclick="window.location.reload()">
<input type=button value=前进 οnclick="window.history.go(1)">
<input type=button value=后退 οnclick="window.history.go(-1)">
<input type=button value=前进 οnclick="window.history.forward()">
<input type=button value=后退 οnclick="window.history.back()"> 后退+刷新<input type=button value=后退 οnclick="window.history.go(-1);window.location.reload()">在C# Web程序中，如为页面按钮写返回上一页代码

this.RegisterClientScriptBlock("E", "<script language=javascript>history.go(-2);</script>");

其中，history.go(-2)，要写为-2，因在按钮事件触发前，已刷新一次页面，所以应是-2。

Response.Write("<script language=javascript>history.go(-2);</script>");

此处也要写为“-2”。跟直接写脚本的有所不同。history.back()是会上一页
i=1
history.go(i)去指定的某页
如果是history.go(0)那就是刷新这两个属于JS代码，相当于IE的前进、后退功能。
具体的用处就要看什么时候需要这个就用上。比如用户注册时的验证是后台验证，不符合要求的时候就可以用这个，可以最大限度保证用户少重复输入数据。
例如：载入页面：
function onLoadPage(){
if(event.srcElement.tagName=="SPAN"){
oFrame=top.window.middle.frames[2];
oTxt=event.srcElement.innerText;
switch(oTxt){
case "前进":
oFrame.history.go(1);
case "后退":
oFrame.history.back();
case "刷新":
oFrame.location.reload();
}
}
}

打开一个jsp页面,肯定是用客户端脚本进行刷新了。
Javascript刷新页面的几种方法：
1 history.go(0)
2 location.reload()
3 location=location
4 location.assign(location)
5 document.execCommand('Refresh')
6 window.navigate(location)
7 location.replace(location)
8 document.URL=location.href

<a href="??????">后退</a>
so easy 的问题在百度就是没找到，我学asp.net的，或者用linkbutton实现也可以，就是做后退功能
asp.net 标签 a
分享到：

------解决方案--------------------
<a href="javascritp:history.go(-1)">后退</a>
------解决方案--------------------
。。。用JS吧，<a href="javascript:history.go(-1);">后退</a>
------解决方案--------------------
<a href="javascript:history.go(-1)">后退</a> 打错了

瀑布流
瀑布流，又称瀑布流式布局。是比较流行的一种网站页面布局，视觉表现为参差不齐的多栏布局，
随着页面滚动条向下滚动，这种布局还会不断加载数据块并附加至当前尾部。最早采用此布局的网
站是Pinterest，逐渐在国内流行开来。
特点
1、琳琅满目：整版以图片为主，大小不一的图片按照一定的规律排列。
2、唯美：图片的风格以唯美的图片为主。
3、操作简单：在浏览网站的时候只需要轻轻滑动一下鼠标滚轮，一切的美妙的图片精彩便可呈现在你面前。
布局优点
1、有效的降低了界面复杂度，节省了空间：我们不再需要臃肿复杂的页码导航链接或按钮了。
2、对触屏设备来说，交互方式更符合直觉：在移动应用的交互环境当中，通过向上滑动进行滚屏的操作已经成为最基本的用户习惯，而且所需要的操作精准程度远远低于点击链接或按钮。
3、更高的参与度：以上两点所带来的交互便捷性可以使用户将注意力更多的集中在内容而不是操作上，从而让他们更乐于沉浸在探索与浏览当中。
布局缺点
1. 有限的用例：
无限滚动的方式只适用于某些特定类型产品当中一部分特定类型的内容。
2. 额外的复杂度：
那些用来打造无限滚动的JS库虽然都自称很容易使用，但你总会需要在自己的产品中进行不同程度的定制化处理，以满足你们自己的需求
3. 再见了，页脚：
如果使用了比较典型的无限滚动加载模式，这就意味着你可以和页脚说拜拜了。
5. SEO：
集中在一页当中动态加载数据，与一页一页的输出相比，究竟那种方式更利于SEO，这是你必须考虑的问题。对于某些以类型网站来说，在这方面进行冒险是很不划算的。
6. 关于页面数量的印象：
其实站在用户的角度来看，这一点并非负面;不过，如果对于你的网站来说，通过更多的内容页面展示更多的相关信息(包括广告)是很重要的策略，那么单页无限滚动的方式对你并不适用。
实现方式编辑
1、传统多列浮动。代表网站蘑菇街和哇哦。
2、用CSS3实现。
3、绝对定位。代表网站Pinterest。
或者用图片延迟加载。
<body>
<div id="container">
<div class="box">
<div class="boximg">
<img src="img/1.jpeg">
</div>
</div>
<div class="box">
<div class="boximg">
<img src="img/2.jpg">
</div>
</div>
<div class="box">
<div class="boximg">
<img src="img/3.jpg">
</div>
</div>
<div class="box">
<div class="boximg">
<img src="img/4.jpg">
</div>
</div>
<div class="box">
<div class="boximg">
<img src="img/5.jpg">
</div>
</div>
<div class="box">
<div class="boximg">
<img src="img/6.jpg">
</div>
</div>
<div class="box">
<div class="boximg">
<img src="img/7.gif">
</div>
</div>
<div class="box">
<div class="boximg">
<img src="img/8.jpg">
</div>
</div>
<div class="box">
<div class="boximg">
<img src="img/9.jpg">
</div>
</div>
<div class="box">
<div class="boximg">
<img src="img/9.jpg">
</div>
</div>
<div class="box">
<div class="boximg">
<img src="img/9.jpg">
</div>
</div>
<div class="box">
<div class="boximg">
<img src="img/9.jpg">
</div>
</div>

</div>

</body>
复制代码
复制代码
<style>
*{
margin: 0px;
padding: 0px;
}
/*将主容器的布局方式设置为相对布局*/
#contianer{
position: relative;
}

.box{
padding: 5px;
float: left;
}
/*将承载图片的容器定制颜色及边框大小和圆角*/
.boximg{
padding: 5px;
box-shadow: 0 0 5px #ccc;
border: 1px solid #cccccc;
border-radius: 5px;
}
/*定制图片尺寸*/
.boximg img{
width: 250px;
height: auto;
}
</style>
复制代码
复制代码
window.onload = function(){
waterFlow("container", "box");
}
function waterFlow(parent, chirld){
var wparent = document.getElementById(parent);//获取父级div, 最外级容器
var allArr = getAllChirld(wparent,chirld);//获取到所有的class为box的容器div
var wscreenWidth = document.documentElement.clientWidth;//获取屏幕宽度
var wchirldWidth = wparent.getElementsByTagName("*");//获取所有的标签
var num = Math.floor(wscreenWidth/wchirldWidth[0].offsetWidth);//这是一个Math算法, 目的是将小数转变为整数,
// 从而可以知道每行最多容纳几张图片
wparent.style.cssText = 'width:'+wchirldWidth[0].offsetWidth*num+'px;margin:0 auto';//固定每行摆放个数和上下左右边距
//获得每行的最小高度
getMinHeightOfCols(allArr, num);
}
function getAllChirld(parent,classname){
//获取所有的标签
var wchirld = parent.getElementsByTagName("*");
//创建数组
var chirldArr = [];
//遍历wchirld, 将其中className等于classname(传进来的参数)相同的标签放入数组chirldArr中
for(var i = 0; i<wchirld.length; i++){
if(wchirld[i].className==classname){
//因为是位push所以没放进去一个, 都是在数组的最后一个
chirldArr.push(wchirld[i]);
}
}
//返回该数组
return chirldArr;
}
function getMinHeightOfCols(chirdArr, num){
//创建数组, 用来盛放每一行的高度
var onlyOneColsArr = [];
for(var i = 0; i<chirdArr.length; i++){

if(i<num){
//num为传进来的参数, 即为每行放图片的张数, 此步骤的目的是为了将第一行每张图片的高度遍历出来存放如新数组
onlyOneColsArr[i]=chirdArr[i].offsetHeight;
} else {
//当大于每行存放的图片个数时进入该方法, Math.min.apply这个方法是为了得到数组中的最小值
var minHeightOfCols = Math.min.apply(null, onlyOneColsArr);
//此方法的目的是为了得到最小高度图片的下表, 也就是在每行的第几张, 具体方法见下面
var minHeightOfindex = getminIndex(onlyOneColsArr, minHeightOfCols);
//定义布局方式为绝对布局
chirdArr[i].style.position = "absolute";
//得到下一行图片应放的高度
chirdArr[i].style.top = minHeightOfCols + "px";
//得到下一行图片应放于那个位置
chirdArr[i].style.left = chirdArr[minHeightOfindex].offsetLeft + "px";
//将两张图片高度相加得到一个新的高度用来进行下一次的计算
onlyOneColsArr[minHeightOfindex] += chirdArr[i].offsetHeight;
}
}

}
//此方法是为了进行最小高度下标的确定
function getminIndex(onlyOneColsArr, min){
//遍历传进来的高度数组
for(var i in onlyOneColsArr){
//如果高度等于最小高度, 返回i即为该图片下标
if(onlyOneColsArr[i] == min){
return i;
}
}
}

上下左右的阿斯科码值

字母和数字键的键码值(keyCode)
按键键码按键键码按键键码按键键码
A 65 J 74 S 83 1 49
B 66 K 75 T 84 2 50
C 67 L 76 U 85 3 51
D 68 M 77 V 86 4 52
E 69 N 78 W 87 5 53
F 70 O 79 X 88 6 54
G 71 P 80 Y 89 7 55
H 72 Q 81 Z 90 8 56
I 73 R 82 0 48 9 57

数字键盘上的键的键码值(keyCode) 功能键键码值(keyCode)
按键键码按键键码按键键码按键键码
0 96 8 104 F1 112 F7 118
1 97 9 105 F2 113 F8 119
2 98 * 106 F3 114 F9 120
3 99 + 107 F4 115 F10 121
4 100 Enter 108 F5 116 F11 122
5 101 - 109 F6 117 F12 123
6 102 . 110
7 103 / 111

控制键键码值(keyCode)
按键键码按键键码按键键码按键键码
BackSpace 8 Esc 27 Right Arrow 39 -_ 189
Tab 9 Spacebar 32 Dw Arrow 40 .> 190
Clear 12 Page Up 33 Insert 45 /? 191
Enter 13 Page Down 34 Delete 46 `~ 192
Shift 16 End 35 Num Lock 144 [{ 219
Control 17 Home 36 ;: 186 \| 220
Alt 18 Left Arrow 37 =+ 187 ]} 221
Cape Lock 20 Up Arrow 38 ,< 188 '" 222

多媒体键码值(keyCode)
按键键码按键键码按键键码按键键码
音量加 175
音量减 174
停止 179
静音 173
浏览器 172
邮件 180
搜索 170
收藏 171
四、加密技术

一：最简单的加密解密

对于JAVASCRIPT函数escape()和unescape()想必是比较了解啦（很多网页加密在用它们），分别是编码和解码字符串，比如例子代码
用escape()函数加密后变为如下格式：
alert%28%22%u9ED1%u5BA2%u9632%u7EBF%22%29%3B
如何？还看的懂吗？当然其中的ASCII字符"alert"并没有被加密，如果愿意我们可以写点JAVASCRIPT代码重新把它加密如下：
%61%6C%65%72%74%28%22%u9ED1%u5BA2%u9632%u7EBF%22%29%3B
当然，这样加密后的代码是不能直接运行的，幸好还有eval(codeString)可用，这个函数的作用就是检查JavaScript代码并执行，必选项
codeString 参数是包含有效 JavaScript 代码的字符串值，加上上面的解码unescape()，加密后的结果如下：

<SCRIPT LANGUAGE="JavaScript">
var code=unescape("%61%6C%65%72%74%28%22%u9ED1%u5BA2%u9632%u7EBF%22%29%3B");
eval(code)
</SCRIPT>
对于此加密的解密，也就同样的简单，（unescape()）
二：转义字符""的妙用

转义字符""，对于JavaScript提供了一些特殊字符如：n （换行）、 r （回车）、' （单引号）等应该是有所了解

的吧？其实""后面还可以跟八进制或十六进制的数字，如字符"a"则可以表示为："141"或"x61"（注意是小写字符"x"），至于双字节字符如汉

字"黑"则仅能用十六进制表示为"u9ED1"（注意是小写字符"u"），其中字符"u"表示是双字节字符，根据这个原理例子代码则可以表示为：

八进制转义字符串如下:

<SCRIPT LANGUAGE="JavaScript">
eval("1411541451621645042u9ED1u5BA2u9632u7EBF425173")
</SCRIPT>
十六进制转义字符串如下:

<SCRIPT LANGUAGE="JavaScript">
eval("x61x6Cx65x72x74x28x22u9ED1u5BA2u9632u7EBFx22x29x3B")
</SCRIPT>
这次没有了解码函数，因为JavaScript执行时会自行转换，同样解码也是很简单如下：

<SCRIPT LANGUAGE="JavaScript">
alert("x61x6Cx65x72x74x28x22u9ED1u5BA2u9632u7EBFx22x29x3B")
</SCRIPT>
就会弹出对话框告诉你解密后的结果！

三：使用Microsoft出品的脚本编码器Script Encoder来进行编码

工具的使用就不多介绍啦！我是直接使用JavaScript调用控件Scripting.Encoder完成的编码！代码如下：

<SCRIPT LANGUAGE="JavaScript">
var Senc=new ActiveXObject("Scripting.Encoder");
var code='<SCRIPT LANGUAGE="JavaScript">rnalert("《Sweet》");rn</SCRIPT>';
var Encode=Senc.EncodeScriptFile(".htm",code,0,"");
alert(Encode);
</SCRIPT>
编码后的结果如下：

<SCRIPT LANGUAGE="JScript.Encode">#@~^FgAAAA==@#@&ls DD`JSweetr#p@#@&FgMAAA==^#~@</SCRIPT>
够难看懂得吧？但相应的解密工具早已出来，而且连解密网页都有！因为其解密网页代码过多，我就不多说拉！给大家介绍一下我独创的解密

代码，如下：

<SCRIPT LANGUAGE="JScript.Encode">
function decode()
alert(decode.toString());
</SCRIPT>
咋样？够简单吧？它是原理是：编码后的代码运行前IE会先对其进行解码，如果我们先把加密的代码放入一个自定义函数如上面的decode()中

，然后对自定义函数decode调用toString()方法，得到的将是解码后的代码！

如果你觉得这样编码得到的代码LANGUAGE属性是JScript.Encode，很容易让人识破，那么还有一个几乎不为人知的window对象的方法

execScript()，其原形为：
window.execScript( sExpression, sLanguage )

参数：
sExpression: 必选项。字符串(String)。要被执行的代码。
sLanguage　: 必选项。字符串(String)。指定执行的代码的语言。默认值为 Microsoft JScript

使用时，前面的"window"可以省略不写！

利用它我们可以很好的运行编码后的JavaScript代码，如下：

<SCRIPT LANGUAGE="JavaScript">
execScript("#@~^FgAAAA==@#@&ls DD`J黑客防线r#p@#@&FgMAAA==^#~@","JScript.Encode")
</SCRIPT>
你可以利用方法二对其中的""号内的字符串再进行编码，使得"JScript.Encode"以及编码特征码"#@~^"不出现，效果会更好！

四：任意添加NUL空字符（十六进制00H）

一次偶然的实验，使我发现在HTML网页中任意位置添加任意个数的"空字符"，IE照样会正常显示其中的内容，并正常执行其中的

JavaScript 代码，而添加的"空字符"我们在用一般的编辑器查看时，会显示形如空格或黑块，使得原码很难看懂，如用记事本查看则"空字符"

会变成"空格"，利用这个原理加密结果如下：（其中显示的"空格"代表"空字符"）
<S C RI P T L ANG U A G E =" J a v a S c r i p t ">

a l er t (" S w e e t") ;

< / SC R I P T>

如何？是不是显得乱七八糟的？如果不知道方法的人很难想到要去掉里面的"空字符"（00H）的！

五：无用内容混乱以及换行空格TAB大法

在JAVASCRIPT代码中我们可以加入大量的无用字符串或数字，以及无用代码和注释内容等等，使真正的有用代码埋没在其中，并把有用的

代码中能加入换行、空格、TAB的地方加入大量换行、空格、TAB，并可以把正常的字符串用""来进行换行，这样就会使得代码难以看懂！如我

加密后的形式如下：

复制代码
<SCRIPT LANGUAGE="JavaScript">
"xajgxsadffgds";1234567890
625623216;var $=0;alert//@$%%&*()(&(^%^
//cctv function//
(//hhsaasajx xc
/*
asjgdsgu*/
"Sweet"//ashjgfgf
/*
@#%$^&%$96667r45fggbhytjty
*/
//window
)
;"#@$#%@#432hu";212351436
</SCRIPT>
复制代码
至少如果我看到这样的代码是不会有心思去分析它的，你哪？

六：自写解密函数法

这个方法和一、二差不多，只不过是自己写个函数对代码进行解密，很多VBS病毒使用这种方法对自身进行加密，来防止特征码扫描！下面

是我写的一个简单的加密解密函数，

加密代码如下（详细参照文件"加密.htm"）：

复制代码
<SCRIPT LANGUAGE="JavaScript">
function compile(code)
{
var c=String.fromCharCode(code.charCodeAt(0)+code.length);
for(var i=1;i<code.length;i++)
alert(escape(c));
}
compile('alert("《Sweet》");')
</SCRIPT>
复制代码
运行得到加密结果为：

o%CD%D1%D7%E6%9CJ%u9EF3%uFA73%uF1D4%u14F1%u7EE1Kd

相应的加密后解密的代码如下：

复制代码
<SCRIPT LANGUAGE="JavaScript">
function uncompile(code)
{
code=unescape(code);
var c=String.fromCharCode(code.charCodeAt(0)-code.length);
for(var i=1;i<code.length;i++)
return c;
}
eval(uncompile("o%CD%D1%D7%E6%9CJ%u9EF3%uFA73%uF1D4%u14F1%u7EE1Kd"));
</SCRIPT>
复制代码
七：错误的利用

利用try{}catch(e){}结构对代码进行测试解密，虽然这个想法很好（呵呵，夸夸自己），因为实用性不大，我仅给个例子

复制代码
<SCRIPT LANGUAGE="JavaScript">

var a='alert("《Sweet》");';
var c="";
for(var i=0;i<a.length;i++)

alert(c);

//上面的是加密代码，当然如果真正使用这个方法时，不会把加密写上的
//现在变量c就是加密后的代码

//下面的函数t()先假设初始密码为０，解密执行，
//遇到错误则把密码加１，然后接着解密执行，直到正确运行

var d=c; //保存加密后的代码
var b=0; //假定初始密码为0
t();

function t()catch(e){
c="";
for(var i=0;i<d.length;i++)
b+=1;
t();
//setTimeout("t()",0);
}
}
</SCRIPT>

转载于:https://www.cnblogs.com/vvva/p/7130335.html

weixin_34410662

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
7.6心得

网页后退<input type=button value=刷新 onclick="window.location.reload()"><input type=button value=前进 onclick="window.history.go(1)"><input type=button value=后退 onclick="window.history.go(-1)"...
复制链接

扫一扫