JS编写完毕上传至生产环境,建议将其压缩,在线压缩:https://c.runoob.com/front-end/51/
1.特定条件下给表格单元格设置背景色
<
script
>
var
rows = document. getElementById( "tbody_8a7e83b852865bf801538383168269ed").
rows. length; //获取表格行数
if
(
rows
>
0
){
for( var
i = 0; i< rows; i++){
var
lowprice = document. getElementById( "field_8a7e85e38113421d01813c0d4d07154c_"
+ i)
if ( lowprice. value < 0.3){
lowprice. parentElement. style. backgroundColor= "yellow"; //
}
}
}
</
script
>
2.根据元素值设置超链接
<
script
>
function
proj( obj) {
var
projNo = document. getElementById( 'field_8a7e83b851c2ef540151d2d2a9947d43').
value;
if (
projNo. length > 0) {
obj.
target = "_blank";
obj.
href = "https://xxx.xxx.com?projNo="
+ projNo
} else {
alert( "未获取到约定书编号,请刷新页面重新点击!")
}
obj.
click()
}
</
script
>
<!-- html调用 -->
<
a
onclick= proj
(
this
)
href= "javascript:void(0)"
>超级链接 </
a
>
3.删除特定下拉框选项
<
script
>
window. onload = function() {
var
obj = document. getElementById( 'field_8a7e85e380352b34018040cfb9dd1fae');
var
count = obj. length;
var
j = 1;
for ( var
i = 0; i < count; i++) {
if (
obj[ j]. value == "f7d4d4345cc91c89015ccf156515616e"
|| obj[ j]. value == "8a7e85e37ca0b4ef017ca7381c0c1557")
{
j++;
}
obj.
options. remove( j);
}
}
</
SCRIPT
>
若仅保留部分选择项
window. onload = function() {
// 获取下拉选项元素
var selectElement = document.getElementById("field_8a7e814a3b88b185013b88c6c35d0063");
// 遍历所有选项
for (var i = 0; i < selectElement.options.length; i++) {
// 如果选项的值不为8a7e83b85c34e4d5015cbfd96bf322ee,则删除该选项
if (selectElement.options[i].value != "8a7e83b85c34e4d5015cbfd96bf322ee") {
selectElement.remove(i);
i--; // 因为删除了一个选项,所以需要将i减1
}
}
4.根据网页文本关键字查找对应元素ID
<
script
>
var
obj =
document.getElementsByClassName("txtflow");
//document.getElementsByName,document.getElementsByTagName
var
n
= obj.
length;
var
result =
'';
var
keyWord
= '关键字'
for (
var
i
= 0; i <
n; i++) {
//obj[i].innerHTML和obj[i].innerText包含当前节点下的所有子节点
if (
obj[
i].
firstChild.
nodeValue.
indexOf(
keyWord)
!= - 1) {
result =
obj[
i].
id;
break;
}
}
</
script
>
5.获取URL中的参数值
<
script
>
function
getQueryVariable(
variable) {
var
query = window. location. search. substring( 1);
var
vars = query. split( "&");
for (
var
i = 0; i < vars. length; i++) {
var
pair = vars[ i]. split( "=");
if ( pair[ 0] == variable) { return
pair[ 1]; }
}
return ( false);
}
var
url = document. URL;
var
id = getQueryVariable( "id");
</
script
>
此代码常常与设置动态超链功能配合使用
6.监听某个按钮被点击
<
script
>
document. getElementById('btn'). addEventListener("click",
function() {
console.
log( "点击了添加按钮");
//添加触发其他动作函数
});
</
script
>
注意:addEventListener不兼容IE低版本,若需要兼容请用以下代码
https://help.dwcpa.com.cn:9443/webdoc/view/Pub8a7e859d8150bc9f018287a906c2247e.html
例1:
<!
DOCTYPE
html
>
<
html
>
<
head
>
<
meta
charset= "UTF-8"
>
<
title
>Document </
title
>
</
head
>
<
body
>
<
input
id= "btn"
type= "button"
value= "按钮"
>
</
body
>
<
script
>
document.
getElementById(
'btn'). addEventListener( "click", function () {
console.
log( "点击了添加按钮");
});
</
script
>
</
html
>
例2:点击表格添加行按钮则删除行中某字段下拉第3、4的选择项
<
script
>
function
removeoOptino( tableID, fieldID) {
var
rows = document. getElementById( tableID). rows. length;
if ( rows > 0) {
for (
var
i = 0; i < rows; i++) {
var
obj = document. getElementById( fieldID + "_" + i)
obj. options. remove( 3);
obj. options. remove( 2);
}
}
}
document.
getElementById(
'add_otable8a7e83b855d7d649015600c65ddb2830').
addEventListener(
"click",
function() {
console.
log( "点击了添加按钮");
removeoOptino( "oTable8a7e83b855d7d649015600c65ddb2830",
"field_8a7e85e3705d92340170e6904d9e3103");
})
</
SCRIPT
>
7.获取动态ID
例1:获取当前节点及所有子节点中第一个关键字的ID
var obj = document.getElementsByClassName("naviSecond");
var n = obj.length;
var result = '';
var keyWord = '关键字'
for (var i = 0; i < n; i++) {
if (obj[i].firstChild.nodeValue.indexOf(keyWord) != -1) {
result = obj[i].id;
break;
}
}
return result
例2:获取当前节点的父节点的ID,若获取失败返回特定值
function(){
try {
var result = document.getElementsByClassName( "x-grid3-row x-grid3-row-first")[0].parentNode.id;
return result
} catch(e) {
return 123
}
}
8.判断当前页面是否为弹窗
if (window.opener != null)
// 此页面为弹窗
else
// 此页面不是弹窗
在特定场景关闭弹窗就可以使用该代码