第一章 未入江湖,先定三分

1. JavaScript是基于对象的、事件驱动的脚本程序设计语言。所谓对象是指任何事物都可以封装成类,而一个类中具体的某个事物就是这个类的对象;所谓事件是指为这些事件定义一些动作,当处理这些事件后就执行相关代码,进行一些操作。

2. 截取字符串www.qdjhu.com中的qdjhu

var siteurl = 'www.qdjhu.com';
var result = siteurl.substr(4,5);

stringObject.substr(start,length);

sub 英[sʌb]美[sʌb]
n.  潜水艇; 代用品,代替者,替补队员; 地铁; 审校员;
vi. 做替身,做替补队员; 做替身,审校(文稿);

3. 判断字符串是否是这样组成的,第一个必须是字母,后面可以是字母、数字、下划线、总长度为5~20;

[a-z]是匹配小写的26个字母,[A-Z]是匹配大写的26个字母,{n}表示匹配几位,\w表示任意的字母、数字、下划线

var c = /^[a-zA-Z]{1}\w{4,19}/

4. indexOf(string)返回字符串中string在父串首次出现的位置,从0开始!没有返回-1。

var stringValue = "hello world";
console.log(stringValue.slice(3,7));    //"lo w"
console.log(stringValue.substring(3,7));    //"lo w"
console.log(stringValue.substr(3,7));   //  "lo worl"
console.log(stringValue.indexOf("o"));  // 4
console.log(stringValue.lastIndexOf("o"));  // 7

5. 如何获取浏览器URL中查询字符串的参数?

Location对象包含了当前页面与位置(url)相关的信息

URL示例:http://www.baidu.com:80/news/index.aspx?id=1&name=location#top

Location对象共定义了8个属性:

href:声明了当前显示文档的完整的URL

protocol:声明URL的协议部分,包括后缀的冒号,例如http:

host:声明当前URL的主机名和端口号(是hostname和port的合集),例如www.baidu.com:80

hostname:声明当前URL的主机名,例如www.baidu.com

port:声明当前URL的端口部分,例如80

pathname:声明当前URL的路径部分,例如news/index.aspx

search:声明当前URL的查询部分,例如?id=1&name=localhost

hash:声明当前URL的锚的部分,例如#top,指定在文档中的锚记的名称

Location对象的这些属性都是可读可写的,如果改变了文档的location.href,则浏览器会载入新的页面。同样如果改变了location.hash,则页面会跳转到新的锚点,但此时页面不会重载。

想必大家会想,这个与link对象的url属性类似啊,不过link对象表示的是文档中的超链接,而Location对象表示的是浏览器当前显示文档的url。



当然,Location对象还有两个方法:reload()和replace()

reload():可以重新装载当前文档

replace():可以装载一个新文档而无须为它创建一个新的历史记录。也就是说,在浏览器的历史列表中,新文档将替换当前文档。这样就不能通过【返回】按钮返回当前文档了。

通过将url字符串信息赋值给窗口的location属性来装载新文档,可以实现返回浏览。

对那些使用了框架而且显示多个临时也的网站来说,replace()方法比较有用,这样临时页面都不被存储在历史列表中。

注意:

不要混淆Window对象的location属性和Document对象的location对象。前者引用一个Location对象,后者只是一个只读字符串,并不具有Location对象的任何特性。Document.location与document.URL是同义的。但是,当存在服务器重定向时,document.location包含的是已经装载的URL,而location.href包含的则是原始请求的文档的URL。



什么是查询字符串?就是Location对象的search属性的值,在这里指?id=1&name=location

那么用Locaton对象结合String对象的方法怎么获取呢?可以用下面这个函数获取:

function getQuery(name)
{
  var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
  var r = window.location.search.substr(1).match(reg);
  if (r!=null) 
    return unescape(r[2]); 
  return null;
}

6. 实现一个删除字符串左边空白字符串的方法

function leftTrim(str){
  return str.replace(/^\s*/g,"");  //^符号表示从开头进行匹配 g表示全局模式,即模式将被应用于所有字符串,而并非发现第一个匹配项时立即停止
}

7.

typeof(null); //object
typeof(NaN);//number

8. js实现反转字符串

function revStr(str){
  var tmpStr = "";
  for(var l = str.length-1;l>=0;l--){
    tmpStr+=str.charAt(l);
  }
  return tmpStr;
}

9.

var a = (Math.PI++);
console.log(a);  //3.141592653589793

10.

var str = 'abcd-ef-ghi';
var arr1 = str.split('-');
var result = arr1.reverse().join('&');
console.log(result);  //ghi&ef&abcd

11. undeclared是一种语法错误,访问undeclared的变量并非会中断浏览器执行。在浏览器运行上下文中,undeclared出来的变量简单可以认为没有var a这样定义变量。JS引擎执行的时候,由于无法找到其对应的上下文(scope),所有会简单地认为该变量是全局变量,就会把该变量定义到window中去。

12. 5种基本数据类型:Undefined Null Boolean Number String。复合数据类型:function函数类型[*]object对象类型,object本质是由一组无序的名值对组成的。array数组类型(它是一种特殊的object对象类型)检查一个变量的数据类型。

13. 实现alert中的换行

alert("hello\nworld");

14. alert()、confirm()和prompt()的区别与用法

1.警告消息框alert
alert 方法有一个参数,即希望对用户显示的文本字符串。该字符串不是 HTML 格式。该消息框提供了一个“确定”按钮让用户关闭该消息框,并且该消息框是模式对话框,也就是说,用户必须先关闭该消息框然后才能继续进行操作。 
window.alert("欢迎!请按“确定”继续。"); 
2.确认消息框confirm 
使用确认消息框可向用户问一个“是-或-否”问题,并且用户可以选择单击“确定”按钮或者单击“取消”按钮。confirm 方法的返回值为 true 或 false。该消息框也是模式对话框:用户必须在响应该对话框(单击一个按钮)将其关闭后,才能进行下一步操作。 
var truthBeTold = window.confirm("单击“确定”继续。单击“取消”停止。"); 
if (truthBeTold) { 
window.alert("欢迎访问我们的 Web 页!"); 
} else window.alert("再见啦!"); 
3.提示消息框prompt
提示消息框提供了一个文本字段,用户可以在此字段输入一个答案来响应您的提示。该消息框有一个“确定”按钮和一个“取消”按钮。如果您提供了一个辅助字符串参数,则提示消息框将在文本字段显示该辅助字符串作为默认响应。否则,默认文本为 ""。 
与alert( ) 和 confirm( ) 方法类似,prompt 方法也将显示一个模式消息框。用户在继续操作之前必须先关闭该消息框 
var theResponse = window.prompt("欢迎?","请在此输入您的姓名。");

15. 鼠标点击页面中的任意标签,alert该标签的名称.(注意兼容性)


 gg IE:有window.event对象 
 FF:没有window.event对象,可以通过给函数的参数传递event对象。如onmousemove=doMouseMove(event)
 ie用e.srcElement,ff用e.target   chrome浏览器同时具有这两个属性

16.

var a = 1;
function f(){
  alert(a);
  var a = 2;
}
f();  //undefined

17. js中outerHTML与innerHTML的区别

使用innerHTML的时候将找着元素的内容(不包含元素本身)
使用outerHTML的时候将找着元素的内容(包含元素本身)

18. window.opener是Javascript中window的一个属性,它返回的是打开当前窗口的窗口对象。如果窗口A弹出一个窗口B,那么在B中window.opener就是窗口对象A;window.location.reload()方法是用来刷新当前整个页面的。

19. js 页面刷新location.reload和location.replace的区别小结

reload 方法,该方法强迫浏览器刷新当前页面。 
语法: location.reload([bForceGet]) 
参数: bForceGet, 可选参数, 默认为 false,从客户端缓存里取当前页。true, 则以 GET 方式,从服务端取最新的页面, 相当于客户端点击 F5("刷新") 

replace 方法,该方法通过指定URL替换当前缓存在历史里(客户端)的项目,因此当使用replace方法之后,你不能通过“前进”和“后退”来访问已经被替换的URL。 
语法: location.replace(URL) 
在实际应用的时候,重新刷新页面的时候,我们通常使用: location.reload() 或者是 history.go(0) 来做。因为这种做法就像是客户端点F5刷新页面,所以页面的method="post"的时候,会出现“网页过期”的提示。那是因为Session的安全保护机制。可以想到: 当调用 location.reload() 方法的时候, aspx页面此时在服务端内存里已经存在, 因此必定是 IsPostback 的。如果有这种应用: 我们需要重新加载该页面,也就是说我们期望页面能够在服务端重新被创建, 我们期望是 Not IsPostback 的。这里,location.replace() 就可以完成此任务。被replace的页面每次都在服务端重新生成。你可以这么写: location.replace(location.href) 

replace函数在设置URL方面与location的href属性或assign函数完全一样,但是它会删除history对象的地址列表中的URL,从而使go或back等函数无法导航。 


1, window.location.href 
整个URl字符串(在浏览器中就是完整的地址栏) 
本例返回值: http://www.jb51.net:80/fisker/post/0703/window.location.html?ver=1.0&id=6#imhere 
2,window.location.protocol 
URL 的协议部分 
本例返回值:http: 
3,window.location.host 
URL 的主机部分 
本例返回值:www.jb51.net 
4,window.location.port 
URL 的端口部分 
如果采用默认的80端口(update:即使添加了:80),那么返回值并不是默认的80而是空字符 
本例返回值:"" 
5,window.location.pathname 
URL 的路径部分(就是文件地址) 
本例返回值:/fisker/post/0703/window.location.html 
6,window.location.search 
查询(参数)部分 
除了给动态语言赋值以外,我们同样可以给静态页面,并使用javascript来获得相信应的参数值 
本例返回值:?ver=1.0&id=6 
7,window.location.hash 
锚点 
本例返回值:#imhere 

20.

document.myForm.xxx按照层级结构来获取
创建var odiv = document.createElement('div');
删除document.body.remove(oP)
添加节点appendChild
复制节点cloneNode
appendTo用来追加到指定元素的末尾
createTextNode()用指定的文本创建新的文本节点对象
createAttibute()用指定名字创建新的Attr节点对象
nodeType用来判断节点类型

cloneNode

var node=document.getElementById("myList2").lastChild.cloneNode(true);
document.getElementById("myList1").appendChild(node);

克隆之前:
Coffee
Tea
Water
Milk

克隆之后:
Coffee
Tea
Milk
Water
Milk

可选。默认是 false。
设置为 true,如果您需要克隆节点及其属性,以及后代
设置为 false,如果您只需要克隆节点及其后代

21. JS nodeName、nodeValue、nodeType返回类型

nodeName 属性含有某个节点的名称。
元素节点的 nodeName 是标签名称
属性节点的 nodeName 是属性名称
文本节点的 nodeName 永远是 #text
文档节点的 nodeName 永远是 #document
注释:nodeName 所包含的 XML 元素的标签名称永远是大写的

nodeValue
对于文本节点,nodeValue 属性包含文本。
对于属性节点,nodeValue 属性包含属性值。
nodeValue 属性对于文档节点和元素节点是不可用的。

nodeType
nodeType 属性可返回节点的类型。
最重要的节点类型是:
元素类型 --> 节点类型
元素element --> 1
属性attr --> 2
文本text -->  3
注释comments --> 8
文档document --> 9


nodeValue就是用来得到“文本元素的值”的,即只适用于“文本节点”;
例子:





John Doe Alaska
以上得到的结果: nv=John; nn=td; nv1=null; 要分清元素的value属性和nodeValue 不一样,nodeValue适用于“文本节点”和“属性节点”;对应“文档节点”和“标签节点”不起作用 接口 nodeType常量 nodeType值 备注 Element Node.ELEMENT_NODE 1 元素节点 Text Node.TEXT_NODE 3 文本节点 Document Node.DOCUMENT_NODE 9 document Comment Node.COMMENT_NODE 8 注释的文本 DocumentFragment Node.DOCUMENT_FRAGMENT_NODE 11 document片断 Attr Node.ATTRIBUTE_NODE 2 节点属性

22. 实现输出document对象中的所有成员的名称和类型



找到所有className包含text的标签
  • ,并将它们的背景颜色设置为黄色 var list = document.getElementByTagname('li'); for(i=0;i
  • 23.

    js的几种循环语句
    for
    for-in
    while
    do-while

    你可能感兴趣的:(第一章 未入江湖,先定三分)