Polymer helloworld: create web component using dom-module

Categories: Development NotesHTML5; Tagged with: ; @ July 19th, 2015 23:10

Requirement:  creating a component to display user info

Step 1:  Create a web component using dom-module:


<link rel="import" href="../bower_components/polymer/polymer.html" />

<dom-module id="user-info">
        <div id="container">
            Hi, <span>{{user_name}}</span>!

        #container {
            font-size: 11px;
            color: gray;


            is: 'user-info',
            properties: {
                user_name: {


Step 2: Use the newly created component:

<link rel="import" href="components/user-info.html" />
<template is="dom-bind">
    <user-info user_name="Li"></user-info>

Python: Parse HTML using Beautiful Soup

Categories: Python; Tagged with: ; @ April 6th, 2014 17:24


Get the FX rate from: http://fx.cmbchina.com/hq


Use urllib2 to get the html, use BeautifulSoup to parse the html;


1.  Get html by urllib2:

import urllib2
html = urllib2.urlopen(“

2. parse the html using BeautifulSoup:

install it:

$ apt-get install python-bs4 // http://www.crummy.com/software/BeautifulSoup/bs4/doc/#installing-beautiful-soup

Python Code:

from bs4 import BeautifulSoup
soup = BeautifulSoup(html)   # you may check the HTML by: print(soup.prettify()) 
sgRateString = soup.find(id=”realRateInfo”).find_all(‘tr’)[8].find_all(‘td’)[5].get_text()
sgRate = float(sgRateString)
print ‘SG Rate:’, sgRate

All Code:


urllib2 examples:  https://docs.python.org/2/library/urllib2.html#examples

BeautifulSoup Quick Start: http://www.crummy.com/software/BeautifulSoup/bs4/doc/#quick-start

Enable/Disable button in HTML using JavaScript

Categories: HTML&JS; Tagged with: ; @ August 8th, 2012 21:21

Here is a button:

<input type="button" class="buttontwofa_text" value="NEXT >" onclick="acceptAgmt()" id="buttonAccept" disabled="true"/>

And also have a radio button group to control the button:

<input type="radio" name="agrmt" value="accept" id="radioAccept" onclick="disableAcceptButton(false)"/> I accept the agreement<br />

<input type="radio" name="agrmt" value="decline" id="radioDecline" onclick="disableAcceptButton(true)"/> I do not accept the agreement

And here is the javaScript:

function disableAcceptButton(disabled) {

document.getElementById("buttonAccept").disabled = disabled;


Show/Hide Div using JavaScript

Categories: HTML&JS; Tagged with: ; @ August 7th, 2012 23:01

Show/Hide div by style.block using JavaScript.

the href button:

<a href="#" onclick="switchDiv()">SwitchDiv</a>

The js:

switchFlag = true;
function switchDiv() {
// alert("clicked");
switchFlag = !switchFlag;

var div1 = document.getElementById('div1');

var div2 = document.getElementById('div2');

if(switchFlag) {

}else {

problems with font color in Firefox/Chrome

Categories: HTML&JS; Tagged with: ; @ August 6th, 2012 19:13


.2f_subtext {
font-size: 11px;
color: #FFFFFF;

The font color is white in IE, there’s no problem, but in Firefox or Chrome, the font color is black.

W3C Css  validator :

In CSS1, a class name could start with a digit (“.55ft”), unless it was a dimension (“.55in”). In CSS2, such classes are parsed as unknown dimensions (to allow for future additions of new units) To make “2f_subtext” a valid class, CSS2 requires the first digit to be escaped “.\32 f_subtext” [2f_subtext]


// Proudly powered by Apache, PHP, MySQL, WordPress, Bootstrap, etc,.