2019-11-27

作者: 早起早起早起up | 来源:发表于2019-11-28 09:47 被阅读0次

11月27日
Mr. L 的ScalersTalk第五轮《新概念》朗读持续力训
文先森的日常--剩15天
2019-11-28
《旅程》-闻禾学写诗
Snail的ScalersTalk第五轮新概念朗读持续力训练Da
给你给我
愚公移山实录
沧海拾遗|bot集锦
当下对React.js的再思考

1.js 对象属性

person.age  
person['age']

for in  循环代码块的每个属性执行一次
var person={'name':hhh,'age':1111}
for (x in person){
     txt += person[x]
}

var person = {firstName:"Bill", lastName:"Gates", age:62, eyeColor:"blue"};
delete person.age;   // 或 delete person["age"];

2.js 对象方法

var person = {
firstname :'hhhh',
lastname:'xxxx',
id:99,
fullName:function (){
return this.firstname+''+this.lastname
}
}
如果调用person 的fullname属性 需要加（）
person.fullname()

3.对象访问器

js 访问器（Getter Setter）

1.get 关键词
var person={
age:111,
firstname:'hh',
lastname:'xxx',
get fullname(){
    return this.firstname + '' +this.lastname
     }
            }
获取fullname属性  person.fullname

2.set 关键词
var person={
firstname : 'h',
name:'',
set lll(lang){
this.name=lang
}

}
person.lll='xxxx';
document.getElementById("demo").innerHTML = person.language;

4.对象构造器

用大写首字母对构造器函数命名是个好习惯
function Person(first, last, age, eye) {
    this.firstName = first;
    this.lastName = last;
    this.age = age;
    this.eyeColor = eye;
}
var myFriend = new Person("Bill", "Gates", 62, "blue");
var myBrother = new Person("Steve", "Jobs", 56, "green");

// 向第一个对象添加 name 方法
myFriend.name = function() {
  return this.firstName + " " + this.lastName;
};

// 显示全名
document.getElementById("demo").innerHTML =
"My friend is " + myFriend.name();

5.对象构造器加属性

对于对象构造器增加属性 Person.nationality = "English"; 不起作用
需要引用prototype 属性
Person.protype.name='english'
也可以方法
Person.prototype.name = function() {
    return this.firstName + " " + this.lastName;
};

6.对象方法

// 创建对象：
var person = {
  firstName: "Bill",
  lastName : "Gates",
  language : "EN" 
};
// 更改属性：
Object.defineProperty(person, "language", {value:"ZH"})
document.getElementById("demo").innerHTML = person.language;

7.js 函数参数

JavaScript 函数定义不会为参数（parameter）规定数据类型。
JavaScript 函数不会对所传递的参数（argument）实行类型检查。
JavaScript 函数不会检查所接收参数（argument）的数量。
1.-Infinity  负无穷大
2.-Infinity  正无穷大
3.arguments 表示这个参数
4.x = findMax(1, 123, 500, 115, 44, 88);

function findMax() {
    var i;
    var max = -Infinity;
    for (i = 0; i < arguments.length; i++) {
        if (arguments[i] > max) {
            max = arguments[i];
        }
    }
    return max;
}

8js call（）方法

call() 方法是预定义的 JavaScript 方法。
它可以用来调用所有者对象作为参数的方法。
通过 call()，您能够使用属于另一个对象的方法。
本例调用 person 的 fullName 方法，并用于 person1
var person = {
    fullName: function() {
        return this.firstName + " " + this.lastName;
    }
}
var person1 = {
    firstName:"Bill",
    lastName: "Gates",
}
var person2 = {
    firstName:"Steve",
    lastName: "Jobs",
}
person.fullName.call(person1);  // 将返回 "Bill Gates"

9.apply 函数

apply() 方法接受数组中的参数：
var person = {
  fullName: function(city, country) {
    return this.firstName + " " + this.lastName + "," + city + "," + country;
  }
}
var person1 = {
  firstName:"John",
  lastName: "Doe"
}
person.fullName.apply(person1, ["Oslo", "Norway"]);
对于数组没有max 方法
Math.max.apply(null, [1,2,3]); // 也会返回 3

10.闭包

内部函数 plus() 可以访问父函数中的 counter 计数器变量：
function add() {
    var counter = 0;
    function plus() {counter += 1;}
    plus();     
    return counter; 
}
自调函数
var add = (function () {
    var counter = 0;
    return function () {return counter += 1;}
})();

add();
add();
add();

// 计数器目前是 3

11.dom 文档

1.该表html 元素
element.innerHTML=new html 
element.attribute=‘hh’  改变属性值
document.getElementById("myImage").src = "landscape.jpg";
element.setAttribute(attribute,value)  增加属性值
element.style.property=new style 样式
document.getElementById("p2").style.color = "blue";
style.visibility='hidden'
style.visibility='visible'
2.添加删除元素
document.createElement(element)    创建 HTML 元素
document.removeChild(element) 删除 HTML 元素
document.appendChild(element) 添加 HTML 元素
document.replaceChild(element) 替换 HTML 元素

12.var x = document.forms[0]["frm1"]; form 所有元素

13.dom 事件

onclick
onchange

14.dom 元素

var node = document.createTextNode("这是一个新段落。");  创建文字
var para = document.createElement("p");
var node = document.createTextNode("这是新文本。");
para.appendChild(node);
removeChild 
parent.replaceChild(para,child);

15.window 浏览器对象

1.基于document 对象是html属性
window.document.getElemntByld('hhh')
document.getElementById("header");
2.窗口尺寸
var w=window.innerWidth 
|| document.documentElemnt.clientWidth
|| document.body.clientWidth
var h = window.innerHeight
|| document.documentElement.clientHeight
|| document.body.clientHeight; 
window.open() - 打开新窗口
window.close() - 关闭当前窗口
window.moveTo() -移动当前窗口
window.resizeTo() -重新调整当前窗口

16.screen 屏幕

screen.height 属性返回以像素计的访问者屏幕的高度。

17.window.history.back()

function goBack(){
window.history.back()

}

17.js 弹出框

JavaScript 有三种类型的弹出框：警告框、确认框和提示框。
1.alert('aaa')   ----警告框
2.var r=confirm('请按按钮')
   if （r==true）{
        x='您按了确认' 
    }
   else{
        x='您按了取消'
    }
3.提示框
var person=prompt("请输入名字")
var person=prompt("请输入名字" ,'aaa') 默认是aaa
if (person != null) {
document.getElementById("demo").innerHTML = "你好 " + person + "！今天过的怎么样？";
}

18.js timing 事件

setTimeout(function, milliseconds)
在等待指定的毫秒数后执行函数。  ---只执行一次
setInterval(function, milliseconds)
等同于 setTimeout()，但持续重复执行该函数。
<button onclick="myVar = setTimeout(myFunction, 3000)">试一试</button>

<button onclick="clearTimeout(myVar)">停止</button>

<script>
function myFunction() {
  alert("Hello");
}
----
<script>
function startTime() {
  var today = new Date();
  var h = today.getHours();
  var m = today.getMinutes();
  var s = today.getSeconds();
  m = checkTime(m);
  s = checkTime(s);
  document.getElementById('txt').innerHTML =
  h + ":" + m + ":" + s;
setTimeout(startTime, 500);
}
function checkTime(i) {
  if (i < 10) {i = "0" + i};  // 在数字 < 10 之前加零
  return i;
}
</script>
</head>

<body onload="startTime()">
--------------------------------------------------------
<p id="demo"></p>

<button onclick="clearInterval(myVar)">停止时间</button>

<script>
var myVar = setInterval(myTimer, 1000);
 function myTimer() {
    var d = new Date();
    document.getElementById("demo").innerHTML = d.toLocaleTimeString();
}
</script>

19.JSON

发送数据
如果您的数据存储在 JavaScript 对象中，您可以把该对象转换为 JSON，然后将其发送到服务器

var myObj = { name:"Bill Gates",  age:62, city:"Seattle" };
var myJSON =  JSON.stringify(myObj);
window.location = "demo_json.php?x=" + myJSON;
接收数据    转换为js 对象
var myJSON = '{ "name":"Bill Gates",  "age":62, "city":"Seattle" }';
var myObj =  JSON.parse(myJSON);
document.getElementById("demo").innerHTML = myObj.name;

20.访问值

for (x in myObj) {
document.getElementById("demo").innerHTML += myObj[x];
}
x = myObj.cars.car2;
//或者：
x = myObj.cars["car2"];

21.html

txt += "<tr><td>" + myObj[x].name + "</td></tr>";

21.jquery

1.var myElement = $("#id01");  id值
2.var myElements = $("p");   标签值
3.var myElements = $(".intro");  类
4.var myElement = $("#02");
  myElement.hide();  隐藏
5.myElement.show();  显示
6.myElement.css("font-size","35px");
7.$("#id").remove();  删除节点
8.element.parentNode.removeChild(element);
9. var myParent = $("#02").parent();
document.getElementById("02").parentNode;

22.按钮 button

1.禁用按钮  disabled=true

22.重置表单 1.document.getElementById("myForm").reset()

2.document.forms[0].reset()

23.表单的值

<form id="frm1" action="/demo/demo_form.asp">
  名：<input type="text" name="fname" value="Bill"><br>
  姓：<input type="text" name="lname" value="Gates"><br><br>
  <input type="submit" value="提交">
</form> 

<p>单击“试一试”以显示表单中每个元素的值。</p>

<button onclick="myFunction()">试一试</button>

<p id="demo"></p>

<script>
function myFunction() {
  var x = document.getElementById("frm1");
  var text = "";
  var i;
  for (i = 0; i < x.length ;i++) {
    text += '<span>'+x.elements[i].value + "</span>";
  }
  document.getElementById("demo").innerHTML = text;
}
</script>

24.select option

document.getElementById("mySelect").disabled=true 禁用列表
document.getElementById("mySelect").disabled=false 启用列表

25.document.getElementById("mySelect").length

26.document.getElementById("mySelect").size=4

27.选择的索引 document.getElementById("mySelect").selectedIndex;

28.显示选择的值

obj=document.getElementById("mySelect")
obj.value
obj.options[obj.selectedIndex].text

29.插入表格

  var x = document.getElementById(id).insertRow(0);
  var y = x.insertCell(0);
  var z = x.insertCell(1);
  y.innerHTML = z.innerHTML = "New";

30.删除行

document.getElementById('myTable').deleteRow(1)

31.onload 页面加载后

32.键帽

11月27日
2019-11-27 毛雅亭字数 633 · 阅读 5 2019-11-11 08:16 ...
Mr. L 的ScalersTalk第五轮《新概念》朗读持续力训
2019-11-27, starting at 2019-10-11 新概念英语第二册 Lesson 48: Di...
文先森的日常--剩15天
日精进打卡第453天姓名：李文杰 (四爷)；公司：中国太平人寿；日期：2019-11-27 【知～学习】《...
2019-11-28
2019-11-27 【日精进打卡第 613 天【知～学习】《六项精进》大纲 4 遍共 2308 遍《大学》...
《旅程》-闻禾学写诗
《旅程》2019-11-27 站在你身后，默默等你回头跟着你前行心向着你走！跟在你身后默默等你回眸...
Snail的ScalersTalk第五轮新概念朗读持续力训练Da
Day48 2019-11-27 • 标题：Snail的ScalersTalk第五轮新概念朗读持续力训练Day48...
给你给我
——2019-11-27—— 原标题Aldo|写给你的》1710 1308怎可让wq轻易示人我可是付湘饭伢～王维家...
愚公移山实录
扎实学“愚公”，定能把“山”移 ——观周枫林老师2019-11-27 00:30 时间:2019年11月26日授...
沧海拾遗|bot集锦
——2019-11-27—— 2145泄私愤的代价》eg被当人质有勇无谋一般都炮灰。《希望的大地》看起来不比《...
当下对React.js的再思考
Time: 2019-11-27 之前在比赛中写前端工程时，使用了如下几个关键的技术点： redux，负责应用状态...