发表于: 2017-04-18 20:56:06
1 675
今天完成的事情:
完成了task1中不正常显示颜色的问题。
关于调试JS
参考链接http://han.guokai.blog.163.com/blog/static/136718271201321402514114/
主要就是设置断点和运行下,然后可以再右侧调用栈(Call Stack)看到执行过的函数,在Scope Variables中看到变量的值。这就够了,可以直接在chrome改完后Ctrl+s保存在调试。快捷键断点调试时一般用的是 F8、F10、F11或 Shitf+F11,很好用。
-----------------------------------------------------------------------------------------------------------
在task1中的颜色 我玩了有符号右移运算(>>),无符号右移运算(>>>),左移运算由两个小于号表示(<<)没用。还有就是% / &。以上都可以用来对16进制的数取高低位。
关于.toString(16)这个不要在数值运算中用,只是在最后显示中用一下就可以了。
-----------------------------------------------------------------------------------------------------------
JSON:JavaScript 对象表示法(JavaScript Object Notation)
例子
<html>
<body>
<h2>在 JavaScript 中创建 JSON 对象</h2>
<p>
Name: <span id="jname"></span><br />
Age: <span id="jage"></span><br />
Address: <span id="jstreet"></span><br />
Phone: <span id="jphone"></span><br />
</p>
<script type="text/javascript">
var JSONObject= {
"name":"Bill Gates",
"street":"Fifth Avenue New York 666",
"age":56,
"phone":"555 1234567"};
document.getElementById("jname").innerHTML=JSONObject.name
document.getElementById("jage").innerHTML=JSONObject.age
document.getElementById("jstreet").innerHTML=JSONObject.street
document.getElementById("jphone").innerHTML=JSONObject.phone
</script>
</body>
</html>
JSON 数据的书写格式是:名称/值对。
名称/值对包括字段名称(在双引号中),后面写一个冒号,然后是值:都不用加;
"firstName" : "John"
等价于这条 JavaScript 语句:
firstName = "John"
-----------------------------------------------------------------------------------------------------------
innerHTML 属性设置或返回表格行的开始和结束标签之间的 HTML。
会改变内容。
-----------------------------------------------------------------------------------------------------------
click() 方法可模拟在按钮上的一次鼠标单击。
focus() 方法用于给予该元素焦点。这样用户不必点击它,就能编辑显示的文本了。就是鼠标直接显示在文本最后闪。
blur和focus相反,blur() 方法用于把焦点从按钮上移开,让你选不中。
click(),focus(),blur()都是button对象的方法。
-----------------------------------------------------------------------------------------------------------
submit() 方法把表单数据提交到 Web 服务器,该方法提交表单的方式与用户单击 Submit 按钮一样,但是表单的 onsubmit 事件句柄不会被调用。
-----------------------------------------------------------------------------------------------------------
jQuery 事件 - keyup() 方法
完整的 key press 过程分为两个部分,按键被按下,然后按键被松开并复位。当按钮被松开时,发生 keyup 事件。它发生在当前获得焦点的元素上。keyup() 方法触发 keyup 事件,或规定当发生 keyup 事件时运行的函数。还有个keydown()
-----------------------------------------------------------------------------------------------------------
JS获取input标签value,就是用getElementById
如 var a=document.getElementById("nn").value;
-----------------------------------------------------------------------------------------------------------
write() 方法可向文档写入 HTML 表达式或 JavaScript 代码。
例子
document.write("Hello World!");
document.write("<h1>Hello World!</h1>")
document.write(mycars[i] + "<br />")
document.write("Hello World! ","Hello You! ","<p style='color:blue;'>Hello
World!</p>")
-----------------------------------------------------------------------------------------------------------
数组常用的循环,就和平常的for一样
for (i=0;i<mycars.length;i++)
{
document.write(mycars[i] + "<br />")
}
这个是for in的
for (x in mycars)
{
document.write(mycars[x] + "<br />")
}
当还是绝对不要用for in
参考http://www.tuicool.com/articles/3meE3a
-------------------------------------------------------------------------------------------
关于数组乱序https://segmentfault.com/a/1190000005875191
不要用Array.prototype.sort用来洗牌
https://www.h5jun.com/post/array-shuffle.html
数组乱序的意思是,把数组内的所有元素排列顺序打乱。
常用的办法是给数组原生的sort方法传入一个函数,此函数随机返回1或-1,达到随机
排列数组元素的目的
arr.sort(function(a,b){ return Math.random()>.5 ? -1 : 1;});
JS的键盘事件
onkeydown 某个键盘按键被按下。
onkeypress 某个键盘按键被按下并松开。
onkeyup 某个键盘按键被松开。
-----------------------------------------------------------------------------------------------------------------------
这里再说下which
which 属性返回onkeypress事件触发的键的值的字符代码,或者 onkeydown 或 onkeyup 事件的键的代码。
两种代码类型的区别是:
字符代码 - 表示 ASCII 字符的数字
键盘代码 - 表示键盘上真实键的数字
提示: 如果需要知道用户按下的是打印键字符键(如 "a" 或 "5"),建议使用 onkeypress 事件。如果需要知道用户按下的是功能键(如 "F1", "CAPS LOCK" 或 "Home") 可使用 onkeydown 或 onkeyup 事件。
兼容这些浏览器你可以使用以下代码:
var x = event.which || event.keyCode; // 使用 which 或 keyCode, 这样可支持不同浏览器
----------------------------------------------------------------------------------------------------------
JS正则表达式http://javascript.ruanyifeng.com/stdlib/regexp.html
RegExp 对象
正则表达式是描述字符模式的对象。
正则表达式用于对字符串模式匹配及检索替换,是对字符串执行模式匹配的强大工具。
语法
var patt=new RegExp(pattern,modifiers);
或者更简单的方式:
var patt=/pattern/modifiers;
pattern(模式) 描述了表达式的模式
modifiers(修饰符) 用于指定全局匹配、区分大小写的匹配和多行匹配
用简单的就行
明天计划的事情:看JS基础
遇到的问题:无
收获:位运算符,调试,颜色取值,JSON,innerHTML,click(),focus(),blur()都是button对象的方法。submit(),keyup() , keypress(),keydown(),JS获取input标签value,write() 方法,数组常用的循环for,数组乱序,JS的键盘事件:onkeyup,onkeydown,onkeypress.which.正则表达式.
成果链接http://119.10.57.69:880/jnshu3938/JS/js/task1/task1.html
代码链接https://github.com/xuoutput/js/blob/master/task1/task1.html
评论