jQuery里封装的有addClass函数,调用十分方便,那么用JS如何实现呢,下面我们来介绍下。
首先是CSS部分
写一个新的class用来添加
HTML部分
一个没有样式的div
script部分
声明addClass函数,把标签元素和新的class作为参数传进去,进行判断,如果标签元素原来有样式,那么就增加一个样式,如果没有样式,那么就把标签元素的样式设为传进来的样式。
调用函数,这样就实现了样式的添加。
更多前端内容 请 点击关注 点击关注
如下示例:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<html xmlns="
<head>
<meta http-equiv="Content-Type" content="text/html charset=utf-8" />
<title>Demo</title>
</head>
<style type="text/css">
a{text-decoration: none}
.class-name{border: 1px solid #CCCCCCbackground: #FFA54F-webkit-border-radius: 5px-moz-border-radius: 5pxkhtml-border-radius: 5pxborder-radius: 5pxpadding: 5px 10pxwidth: 100pxtext-align: center}
</style>
<body>
<div id="main">
<a href="javascript:" onclick="add_class()">添加Class</a>
</div>
<script language="javascript" type="text/javascript">
function add_class(){
document.getElementById('main').className = 'class-name'
}
</script>
</body>
</html>
测试效果如下:
添加class前
添加class后
与jQuery的addClass同一效果的。
1、代码:Wv.getSettings().setLightTouchEnabled(true)
Wv.getSettings().setJavaScriptEnabled(true)
Wv.addJavascriptInterface(myJavaScriptInterface, "AndroidFunction")
public class JavaScriptInterface {
Context mContext
JavaScriptInterface(Context c) {
mContext = c
}
public void showToast(String webMessage){
final String msgeToast = webMessage
myHandler.post(new Runnable() {
@Override
public void run() {
// This gets executed on the UI thread so it can safely modify Views
myTextView.setText(msgeToast)
}
})
Toast.makeText(mContext, webMessage, Toast.LENGTH_SHORT).show()
}
}
2、js中调用
AndroidFunction.showToast(testVal)