谷歌浏览器内核Cef js代码整理(一)
尊重作者原创,未经作者允许不得转载!作者:xtfnpgy,原文地址:
https://www.cnblogs.com/xtfnpgy/p/9285359.html
一.js基础知识
<!-- -->是HTML的注释标签,使用 < 和 > 是符合HTML标签语法规则的。
//(注释单行)是JS的注释标签
/* */(注释代码块)是CSS的注释标签 推荐使用!js净化以后不影响
回车 \r\n
等于 ==
不等于 !=
赋值 =
或且非 || && !
加减乘除 +-*/
类型转换 parseInt(str) parseFloat(str) str.toString()
强制类型转换 Number(str) String(num) (不适合javascript)
字符串长度: str.length
字符串截取: str.substr(1,5)
字符串连接: str1 + str2
字符串替换: str.replace
字符串查找: str.indexOf()
字符串分割: arr = str.split(",")
字符串固定位置值: str.chatAt(0) ,类似s[0]
字符串大小写: str.toLowerCase str.toUpperCase
Node.childNodes //获取所有子节点
Node.firstChild //返回第一个子节点
Node.lastChild //返回最后一个子节点
Node.parentNode //返回父节点
Node.previousSibling //返回前一个节点
Node.nextSibling //返回后一个节点
parentNode.removeChild(childNode); //移除节点
parentNode.appendChild(childNode); //追加节点
parentNode.insertBefore(newNode, targetNode) //插入节点
ele.fireEvent('onchange', oEvent); //激活事件
二、登录例子
var ele_user=document.getElementById('txtUserName');
var ele_pwd=document.getElementByName('txtPassword')[0];
var ele_login=document.getElementByClassName('login')[0];
ele_user.setAttribute('value','admin');
ele_pwd.setAttribute('value','admin');
function ClickElement(AObj) {
AObj.target = '_self';
var e = document.createEvent("MouseEvent"); /*事件名Cef1区分大小写*/
e.initEvent("click", true, true); /*click必须小写!*/
AObj.dispatchEvent(e);
} ; /*结尾必须加分号";"*/
ClickElement(ele_login); /*点击登录*/
三、获取元素及属性
1.getElementById
var ele_user=document.getElementById('txtUserName');
2.getElementsByName
var ele_user=document.getElementsByName('userName')[0]; /*取集合的第一个元素*/
3.getElementsByTagName /*根据元素类型标识元素*/
/*常用Tag:HTML FRAME FORM TABLE TR TD DIV SPAN A INPUT IMG (不区分大小写)*/
var ele = document.getElementsByTagName('html')[0];
alert(ele.innerHTML);
4.getElementsByClassName /*根据元素class获取元素*/
var ele = document.getElementsByClassName('form-control')[0];
alert(ele.innerHTML);
四、元素常用属性
1.可以直接用.操作的
ele.id
ele.name
ele.className /*区分大小写,源代码对应class*/
ele.type /*type属性*/
ele.value /*输入的值*/
ele.href
ele.innerText /*显示的文本内容,例如标签*/
ele.innerHTML
ele.outerHTML
2.其他属性获取和设置
style 不能直接.获取,必须通过getAttribute获取
ele.getAttribute('onClick'); //不存在返回null
ele.setAttribute('onClick', null);
五、扩展方法
1.JavaScript 遍历页面中所有的元素
function GetAllElements(tag)
{
var nodes;
var s;
var temp;
if((tag=="") || (tag==null))
{nodes = document.all;}
else
{nodes = document.getElementsByTagName(tag);}
for(var i=0;i<nodes.length;i++)
{
var o = nodes[i];
temp = i+' id:'+o.id +',name:' + o.name +',tagName:'+ o.tagName ;
if(tag=='A')
{
temp = temp + ',innerText:' + o.innerText+ ',href:' + o.href+"\r\n";
}
else if((tag=='SPAN')||(tag=='DIV'))
{
temp = temp + ',innerText:' + o.innerText+ ',className:' + o.className+"\r\n";
}
else if(tag=='IMG')
{
temp=temp + ',src:' + o.src+"\r\n";
}
else
{
if((o.innerText=="") || (o.innerText==null))
{
if((o.innerHTML=="") || (o.innerHTML==null))
{temp = temp + ',outerHTML:' + o.outerHTML+"\r\n";}
else
{temp = temp + ',innerHTML:' + o.innerHTML+"\r\n"; }
}
else
{temp = temp + ',innerText:' + o.innerText+"\r\n"; }
}
if(temp.length>100)
{ temp = temp.substr(1,100)+"\r\n";}
s = s + temp;
}
alert(s);
};
/*调用:GetAllElements(''); GetAllElements('A'); */
2.JavaScript 遍历元素所有的属性
function GetAllAttributes(obj)
{
var s='';
if(obj!=null)
{
for(var i=0; i<obj.attributes.length; i++)
{
s=s+obj.attributes[i].name+':'+obj.attributes[i].value+'\r\n';
}
}
return s;
} ;
调用:
var ele = document.getElementById('login');
alert(GetAllAttributes(ele));
3.JavaScript 遍历元素所有子节点
function GetAllChilds(obj)
{
var s='';
if(obj!=null)
{
for(var i=0; i<obj.childNodes.length; i++)
{
s=s+obj.childNodes[i].innerHTML+'\r\n';
}
}
return s;
} ;
调用:
var ele = document.getElementByTagName('HTML')[0];
alert(GetAllChilds(ele));
4.根据元素属性获取元素
function GetElementByTagProperty(tag,str_property,str_value,bl_exact)
{
var nodes;
var s;
var temp;
var attr;
if((tag=="") || (tag==null))
{nodes = document.all;}
else
{nodes = document.getElementsByTagName(tag);}
for(var i=0;i<nodes.length;i++)
{
if(str_property == 'innerText'){
attr = nodes[i].innerText;} else
if(str_property == 'class'){
attr = nodes[i].className;} else
if(str_property == 'classname'){
attr = nodes[i].className;} else
if(str_property == 'className'){
attr = nodes[i].className;} else {
attr =nodes[i].getAttribute(str_property);}
if(bl_exact)
{
if(attr==str_value)
{
temp=nodes[i];
}
}
else
{
if(attr!=null)
{
if(attr.indexOf(str_value)>-1){temp=nodes[i];}
}
}
}
return temp;
}
调用:
var o=GetElementByTagProperty('A','id','540219887479',false);
5.某宝搜索动态插入勾选框元素:
function AddCheckBoxElement()
{
var nodes;
var ele;
var temp;
nodes = document.getElementsByTagName('A');
var oCheckbox;
for(var i=0;i<nodes.length;i++)
{
if(nodes[i].getAttribute('id')!=null)
{
if(nodes[i].getAttribute('id').indexOf('J_Itemlist_TLink_')>-1)
{
ele = nodes[i];
temp = ele.getAttribute('id');
temp = temp.replace('J_Itemlist_TLink_','');
oCheckbox=document.createElement("input");
oCheckbox.setAttribute("type","checkbox"); /*勾选框*/
oCheckbox.setAttribute("id","chk_" + temp);
oCheckbox.setAttribute("href",ele.href);
ele.parentNode.insertBefore(oCheckbox,ele);
var myText=document.createTextNode("选中"+oCheckbox.id);
ele.parentNode.insertBefore(myText,ele);
oCheckbox.addEventListener('click', function(){
alert(document.activeElement.id + document.activeElement.checked);}, false);
}
}
}
}
AddCheckBoxElement();
六、其他
1.定时器
function doTimer(){ window.location.reload();};
执行一次:
var t1 = window.setTimeout('doTimer()',5000);
执行多次:
var t2 = window.setInterval('doTimer()',5000);
清除定时器:
window.clearInterval(t1);
2.判断是否IE
function isIE() {
if (!!window.ActiveXObject || "ActiveXObject" in window)
return true;
else
return false;
};
3.点击勾选框
if(isIE()){oCheckbox.attachEvent("onclick",ClickCheckbox); }
else{
oCheckbox.addEventListener('click',ClickCheckbox, false);}
function ClickCheckbox(){
var evtTarget = event.target || event.srcElement;
evtTarget.focus();
if(document.activeElement.getAttribute("attrChecked")=="true")
{document.activeElement.setAttribute("attrChecked",false) }
else {document.activeElement.setAttribute("attrChecked",true) };
alert('Checked='+document.activeElement.getAttribute("attrChecked")+',href='+
document.activeElement.getAttribute("href")+',');}
尊重作者原创,未经作者允许不得转载!作者:xtfnpgy,原文地址:
https://www.cnblogs.com/xtfnpgy/p/9285359.html
谷歌浏览器内核Cef js代码整理(一)的更多相关文章
- 谷歌浏览器内核Cef js代码整理(三) 字符串处理
*字符串截取方法*/ var s="abc_def[ghi]jk[i]"; var temp;function CopyFromStr(str_source,str_key, bl ...
- 谷歌浏览器内核Cef js代码整理(二) 滚动条
1.隐藏滚动条 document.documentElement.style.overflow = 'hidden';隐藏竖向滚动条:document.documentElement.style.ov ...
- 常用js代码整理、收集
个人整理了一下个人常用到的一些js代码,以方便学习以及日后使用,或许有一些是个人之前从网上摘下来的,但是不记得是具体从哪里来的了,如果你看到有一段代码跟你的文章很相似甚至一样,请不要气愤,请告诉我,我 ...
- 常用JS代码整理
1: function request(paras) { 2: var url = location.href; 3: var paraString = url.substring(url.index ...
- 【JS学习】-利用谷歌浏览器调试JS代码(转)
谷歌浏览器是常用来调试JS代码的工具,本文主要介绍如何利用谷歌浏览器来调试JS代码,协助我们进行开发工作. 首先,打开谷歌浏览器,按快捷键F12或者ctrl+shift+j,就可以打开谷歌浏览器的开发 ...
- 谷歌浏览器如何调试JS
平常在开发过程中,经常会接触到前端页面.那么对于js的调试那可是家常便饭,谷歌浏览器是常用来调试JS代码的工具,本文主要介绍如何利用谷歌浏览器来调试JS代码,协助我们进行开发工作,加快开发效率. 1. ...
- JS代码大全 (都是网上看到 自己整理的)
事件源对象 event.srcElement.tagName event.srcElement.type 捕获释放 event.srcElement.setCapture(); event. ...
- JS代码大全(都是网上看到自己整理的)
事件源对象 event.srcElement.tagName event.srcElement.type 捕获释放 event.srcElement.setCapture(); event.srcE ...
- 最新的JavaScript核心语言标准——ES6,彻底改变你编写JS代码的方式!【转载+整理】
原文地址 本文内容 ECMAScript 发生了什么变化? 新标准 版本号6 兑现承诺 迭代器和for-of循环 生成器 Generators 模板字符串 不定参数和默认参数 解构 Destructu ...
随机推荐
- css预处理器--sass学习($变量名)
sass有两种形式1.scss 2.sass 一:代码的基本用法 1.变量 如果变量需要镶嵌在字符串之中,就必须需要写在#{}之中. $side : left; .rounded { border- ...
- String.valueOf() ,其他类型转为字符型
1. 由 基本数据型态转换成 String String 类别中已经提供了将基本数据型态转换成 String 的 static 方法 也就是 String.valueOf() 这个参数多载的方法 有下 ...
- Learn how to use git
Git配置 $ git config --global user.name "Your Name" $ git config --global user.email "e ...
- VSTO:使用C#开发Excel、Word【17】
使用Range对象Range对象表示电子表格中的单元格范围.范围可以包含一个单元格,多个连续的单元格,甚至多个不连续的单元格.您可以在Excel中选择时按住Ctrl键选择多个不连续的单元格. 获取特定 ...
- 2 第一个Django应用 第1部分(数据库与模型)
目标应用: 一个公开的网站,可以让访客查看投票的结果并让他们进行投票. 一个后台管理网站,你可以添加.修改和删除选票. 查看django版本 python -c "import django ...
- ipone 5s上,字体rem遇到的问题
webapp中,12px的字体,利用rem实现自适应布局, 发现只有在ipone 5s中字体超大, 这两个class元素中字体一样大小,发现上面元素字体在ipone 5s中很大, 后来验证问题在哪里, ...
- NotePad++配置使之支持jquery、html、css、javascript、php提示
1.将以下文件复制到Notepad++\plugins\apis覆盖之前的xml文件 javascript.xml html.xml css.xml 2.打开notepad++设置>首选项& ...
- 运维grep语法
grep的语法和用法 grep命令的格式: grep [options] PATTERN [FILE] 其中:1,pattern是用正则表达式书写的模式.2,FILE是要查找的文件,可以是用 ...
- 9--Python入门--模块
模块简单来说是一个保存了python代码的文件很多python开源库就是模块 #例如我们调用科学计算库 numpy import numpy as np #as np是为了之后方便调用 from pa ...
- 2.oracle之用户管理sql
--创建用户--create user 用户名 identified by 密码;create user jojo identified by bean; --给用户授权--grant conn ...